update package for v3

Author: RenaudRohlinger

bin/create-r3f-app

@@ -15,6 +15,7 @@ program
   .version(pkg.version)
   .arguments('<app-type> <project-directory> [app-style] ')
   .option('-ts, --typescript', 'create r3f app with TypeScript')
+  .option('-b, --branch <value>', 'choose a branch to create the app from (useful for the contributors)')
   .usage(`${chalk.yellow('<app-type>')} ${chalk.green('<project-directory>')} ${chalk.magenta('[app-style]')} `)
   .action(function projectNameAction(type, name, style) {
     appType = type;
@@ -27,10 +28,12 @@ program
 
 const options = program.opts();
 const projectOption = options.typescript ? 'typescript' : 'default';
+const projectBranch = program.branch ? program.branch : 'main';
 
 createR3fApp({
   appType,
   projectName,
   projectOption,
+  projectBranch,
   appStyle,
 });

lib/index.js

@@ -11,7 +11,7 @@ const next = require('./stacks/next');
 // todo add gatsby and native
 const appTypes = ['next'];
 
-module.exports = async function createR3fApp({ projectName, appType, projectOption, appStyle }) {
+module.exports = async function createR3fApp({ projectName, appType, projectOption, projectBranch, appStyle }) {
   console.log(chalk.bold(chalk.blue(`Welcome. Project's generation started using create-R3F-App 🐱`)));
 
   await checkForUpdate();
@@ -40,7 +40,7 @@ module.exports = async function createR3fApp({ projectName, appType, projectOpti
 
   switch (appType) {
     case 'next':
-      next(projectName, projectPath, appStyle, projectOption);
+      next(projectName, projectPath, appStyle, projectOption, projectBranch);
       break;
     default:
       break;

lib/stacks/next.js

@@ -164,7 +164,7 @@ const migrateTailwindToStyled = async (root) => {
   const targetJsxFiles = srcJsxFiles.filter(file => {
     const parsed = sysPath.parse(file);
     const fileName = parsed.name;
-    if (fileName === 'dom' || fileName === 'Instructions') return file;
+    if (fileName === 'Layout' || fileName === 'Instructions') return file;
   });
 
   const prettier = importFrom(root, 'prettier');
@@ -291,7 +291,7 @@ const initForStyledComponents = async (root) => {
   output.success('Succeed to initialize for styled-components');
 }
 
-async function next(projectName, projectPath, projectStyle, projectOption) {
+async function next(projectName, projectPath, projectStyle, projectOption, projectBranch) {
   output.info(
     `🚀 Creating ${chalk.bold(chalk.green(projectName))} using ${chalk.bold(
       'r3f-next-starter',
@@ -302,7 +302,7 @@ async function next(projectName, projectPath, projectStyle, projectOption) {
   const isPmndrs = isNotDefaultStyle && projectStyle !== 'styled';
   const hostedInfo = hostedGitInfo.fromUrl('https://github.com/pmndrs/react-three-next');
   const url = hostedInfo.https({ noCommittish: !isPmndrs, noGitPlus: true });
-  const branch = isPmndrs ? ['--branch', 'pmndrs'] : ['--branch', 'main'];
+  const branch = isPmndrs ? ['--branch', 'pmndrs'] : ['--branch', projectBranch || 'main'];
   const recursive = isPmndrs ? [] : ['--recursive'];
   const args = [
     'clone',

package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-r3f-app",
-  "version": "1.5.5",
+  "version": "1.5.8",
   "description": "The easiest and fastest way to create new 3D web projects with react and threejs.",
   "contributors": [
     "Renaud ROHLINGER <[email protected]>"