create-react-on-rails-app 16.4.0 → 16.5.0

package/lib/create-app.js

@@ -9,6 +9,7 @@ exports.createApp = createApp;
 const path_1 = __importDefault(require("path"));
 const fs_1 = __importDefault(require("fs"));
 const utils_js_1 = require("./utils.js");
+const DOCS_URL = 'https://reactonrails.com/docs/';
 function cleanupAppDirectory(appPath, appName, cleanupSuccessMessage, cleanupFallbackMessage) {
     if (!fs_1.default.existsSync(appPath)) {
         return;
@@ -52,23 +53,100 @@ function buildGeneratorArgs(options) {
     if (options.rspack) {
         args.push('--rspack');
     }
+    // --rsc supersedes --pro because RSC mode already requires Pro and the generator accepts a single mode flag.
+    if (options.pro && !options.rsc) {
+        args.push('--pro');
+    }
     if (options.rsc) {
         args.push('--rsc');
     }
+    // --force makes the generator overwrite conflicting files without prompting,
+    // which is safe for a freshly scaffolded app with no custom content yet.
+    args.push('--force');
+    // The newly created app directory is not a git repo yet, so the generator's
+    // uncommitted-changes check would always warn. --ignore-warnings bypasses all
+    // generator validation warnings (git, Node version, package manager) which is
+    // acceptable for a fresh app where prerequisites were already checked above.
     args.push('--ignore-warnings');
     return args;
 }
+function packageManagerFieldValue(packageManager) {
+    const version = (0, utils_js_1.getCommandVersion)(packageManager)?.replace(/^v/, '');
+    if (!version) {
+        (0, utils_js_1.logInfo)(`Could not detect ${packageManager} version; package.json "packageManager" field will omit the version.`);
+    }
+    return version ? `${packageManager}@${version}` : packageManager;
+}
+function updateJsonFile(filePath, updater) {
+    if (!fs_1.default.existsSync(filePath)) {
+        return;
+    }
+    let json;
+    try {
+        json = JSON.parse(fs_1.default.readFileSync(filePath, 'utf8'));
+    }
+    catch (error) {
+        const message = error instanceof Error ? error.message : 'invalid JSON';
+        throw new Error(`Could not parse ${filePath}: ${message}`);
+    }
+    const updatedJson = updater(json);
+    fs_1.default.writeFileSync(filePath, `${JSON.stringify(updatedJson, null, 2)}\n`, 'utf8');
+}
+function rewriteFileIfPresent(filePath, transform) {
+    if (!fs_1.default.existsSync(filePath)) {
+        return;
+    }
+    const original = fs_1.default.readFileSync(filePath, 'utf8');
+    const updated = transform(original);
+    if (updated !== original) {
+        fs_1.default.writeFileSync(filePath, updated, 'utf8');
+    }
+}
+function normalizeGeneratedPackageManager(appPath, packageManager) {
+    if (packageManager !== 'pnpm') {
+        return;
+    }
+    (0, utils_js_1.logInfo)('Normalizing generated app for pnpm...');
+    const packageJsonPath = path_1.default.join(appPath, 'package.json');
+    const packageLockPath = path_1.default.join(appPath, 'package-lock.json');
+    const setupPath = path_1.default.join(appPath, 'bin', 'setup');
+    updateJsonFile(packageJsonPath, (json) => ({
+        ...json,
+        packageManager: packageManagerFieldValue(packageManager),
+    }));
+    if (fs_1.default.existsSync(packageLockPath)) {
+        (0, utils_js_1.execLiveArgs)('pnpm', ['import'], appPath);
+        (0, utils_js_1.execLiveArgs)('pnpm', ['install'], appPath);
+        fs_1.default.rmSync(packageLockPath, { force: true });
+    }
+    else {
+        (0, utils_js_1.execLiveArgs)('pnpm', ['install'], appPath);
+    }
+    rewriteFileIfPresent(setupPath, (contents) => {
+        // Match both system!("npm install") and system("npm install") in bin/setup,
+        // preserving the bang (!) if present.
+        const updated = contents.replace(/system(!?)\((["'])npm install\2\)/g, 'system$1($2pnpm install$2)');
+        if (updated === contents && /(?<![p])npm install/.test(contents)) {
+            (0, utils_js_1.logInfo)('Could not auto-update bin/setup for pnpm. Replace "npm install" with "pnpm install" manually.');
+        }
+        return updated;
+    });
+    (0, utils_js_1.logStepDone)('pnpm configuration applied');
+}
 function printSuccessMessage(appName, route) {
     console.log('');
     (0, utils_js_1.logSuccess)(`Created ${appName} with React on Rails!`);
     console.log('');
     (0, utils_js_1.logInfo)('Next steps:');
     console.log(`  cd ${appName}`);
+    console.log('  bin/rails db:prepare');
     console.log('  bin/dev');
     console.log('');
+    (0, utils_js_1.logInfo)('Note: The generated app uses PostgreSQL by default. Start PostgreSQL before running bin/rails db:prepare.');
+    console.log('');
     (0, utils_js_1.logInfo)(`Then visit http://localhost:3000/${route}`);
     console.log('');
-    (0, utils_js_1.logInfo)('Documentation: https://www.shakacode.com/react-on-rails/docs/');
+    (0, utils_js_1.logInfo)(`Documentation: ${DOCS_URL}`);
     console.log('');
 }
 function validateAppName(name) {
@@ -96,11 +174,19 @@ function validateAppName(name) {
 }
 function createApp(appName, options) {
     const appPath = path_1.default.resolve(process.cwd(), appName);
+    const proRequested = options.pro || options.rsc;
+    let proModeLabel = null;
+    if (options.rsc) {
+        proModeLabel = '--rsc';
+    }
+    else if (options.pro) {
+        proModeLabel = '--pro';
+    }
     const baseSteps = 3; // rails new + add react_on_rails + run generator
-    const totalSteps = baseSteps + (options.rsc ? 1 : 0);
+    const totalSteps = baseSteps + (proRequested ? 1 : 0);
     let currentStep = 1;
     const reactOnRailsGemPath = localGemPath('REACT_ON_RAILS_GEM_PATH');
-    const reactOnRailsProGemPath = options.rsc ? localGemPath('REACT_ON_RAILS_PRO_GEM_PATH') : null;
+    const reactOnRailsProGemPath = proRequested ? localGemPath('REACT_ON_RAILS_PRO_GEM_PATH') : null;
     // Step 1: Create Rails application
     // appName is validated by validateAppName() to be ^[a-zA-Z][a-zA-Z0-9]*([_-][a-zA-Z0-9]+)*$ only,
     // so it's always a simple directory name safe to use with rails new.
@@ -136,9 +222,9 @@ function createApp(appName, options) {
         cleanupAppDirectory(appPath, appName, 'Directory removed. Fix gem installation access or connectivity issues and rerun.', `Delete the created "${appName}" directory and rerun once gem installation issues are resolved.`);
         process.exit(1);
     }
-    if (options.rsc) {
+    if (proRequested) {
         currentStep += 1;
-        (0, utils_js_1.logStep)(currentStep, totalSteps, 'Adding react_on_rails_pro gem (--rsc)...');
+        (0, utils_js_1.logStep)(currentStep, totalSteps, `Adding react_on_rails_pro gem (${proModeLabel})...`);
         try {
             const reactOnRailsProArgs = bundleAddArgs('react_on_rails_pro', reactOnRailsProGemPath, false);
             if (reactOnRailsProGemPath) {
@@ -148,11 +234,11 @@ function createApp(appName, options) {
             (0, utils_js_1.logStepDone)('react_on_rails_pro gem added');
         }
         catch (error) {
-            (0, utils_js_1.logError)('Failed to add react_on_rails_pro gem required by --rsc.');
+            (0, utils_js_1.logError)(`Failed to add react_on_rails_pro gem required by ${proModeLabel}.`);
             if (error instanceof Error && error.message) {
                 console.error(`Debug info: ${error.message}`);
             }
-            cleanupAppDirectory(appPath, appName, 'Directory removed. Ensure react_on_rails_pro is installable in your Bundler/RubyGems setup, then rerun with --rsc.', `Ensure react_on_rails_pro is installable, then delete the created "${appName}" directory and rerun with --rsc.`);
+            cleanupAppDirectory(appPath, appName, `Directory removed. Ensure react_on_rails_pro is installable in your Bundler/RubyGems setup, then rerun with ${proModeLabel}.`, `Ensure react_on_rails_pro is installable, then delete the created "${appName}" directory and rerun with ${proModeLabel}.`);
             process.exit(1);
         }
     }
@@ -161,7 +247,10 @@ function createApp(appName, options) {
     currentStep += 1;
     (0, utils_js_1.logStep)(currentStep, totalSteps, 'Running React on Rails generator...');
     try {
-        (0, utils_js_1.execLiveArgs)('bundle', ['exec', 'rails', 'generate', 'react_on_rails:install', ...generatorArgs], appPath);
+        (0, utils_js_1.execLiveArgs)('bundle', ['exec', 'rails', 'generate', 'react_on_rails:install', ...generatorArgs], appPath, {
+            ...process.env,
+            REACT_ON_RAILS_PACKAGE_MANAGER: options.packageManager,
+        });
         (0, utils_js_1.logStepDone)('React on Rails setup complete');
     }
     catch (error) {
@@ -172,6 +261,23 @@ function createApp(appName, options) {
         cleanupAppDirectory(appPath, appName, 'Directory removed. Fix the generator issue and rerun.', `Delete the created "${appName}" directory and rerun once the generator issue is resolved.`);
         process.exit(1);
     }
+    try {
+        normalizeGeneratedPackageManager(appPath, options.packageManager);
+    }
+    catch (error) {
+        (0, utils_js_1.logError)(`Failed to finish ${options.packageManager} setup. The app was created, but package manager normalization did not complete.`);
+        if (error instanceof Error && error.message) {
+            console.error(`Debug info: ${error.message}`);
+        }
+        (0, utils_js_1.logInfo)('To finish manually:');
+        if (options.packageManager === 'pnpm') {
+            console.log(`  cd ${appName}`);
+            console.log('  pnpm import');
+            console.log('  rm -f package-lock.json');
+            console.log('  pnpm install');
+        }
+        process.exit(1);
+    }
     // Final success
     (0, utils_js_1.logStepDone)('Done!');
     printSuccessMessage(appName, options.rsc ? 'hello_server' : 'hello_world');

package/lib/index.js

@@ -31,6 +31,7 @@ function run(appName, rawOpts) {
         template,
         packageManager: packageManager,
         rspack: Boolean(rawOpts.rspack),
+        pro: Boolean(rawOpts.pro),
         rsc: Boolean(rawOpts.rsc),
     };
     console.log('');
@@ -41,10 +42,14 @@ function run(appName, rawOpts) {
         (0, utils_js_1.logError)(nameValidation.error ?? 'Invalid app name');
         process.exit(1);
     }
-    if (options.rsc) {
-        (0, utils_js_1.logInfo)('Note: --rsc installs react_on_rails_pro and requires that gem to be installable.');
-        (0, utils_js_1.logInfo)('If installation fails, verify your Bundler/RubyGems setup for react_on_rails_pro, then rerun with --rsc.');
-        (0, utils_js_1.logInfo)('Pro setup docs: https://www.shakacode.com/react-on-rails-pro/docs/installation/');
+    if (options.rsc && options.pro) {
+        (0, utils_js_1.logInfo)('Note: --rsc takes precedence over --pro; --pro will be ignored.');
+    }
+    if (options.rsc || options.pro) {
+        const modeFlag = options.rsc ? '--rsc' : '--pro';
+        (0, utils_js_1.logInfo)(`Note: ${modeFlag} installs react_on_rails_pro and requires that gem to be installable.`);
+        (0, utils_js_1.logInfo)(`If installation fails, verify your Bundler/RubyGems setup for react_on_rails_pro, then rerun with ${modeFlag}.`);
+        (0, utils_js_1.logInfo)('Pro setup docs: https://reactonrails.com/docs/pro/installation/');
         console.log('');
     }
     (0, utils_js_1.logInfo)('Checking prerequisites...');
@@ -67,7 +72,14 @@ function run(appName, rawOpts) {
         process.exit(1);
     }
     console.log('');
-    (0, utils_js_1.logInfo)(`Creating "${appName}" with template: ${options.template}, package manager: ${options.packageManager}${options.rspack ? ', bundler: rspack' : ''}${options.rsc ? ', mode: rsc' : ''}`);
+    let modeLabel = '';
+    if (options.rsc) {
+        modeLabel = ', mode: rsc';
+    }
+    else if (options.pro) {
+        modeLabel = ', mode: pro';
+    }
+    (0, utils_js_1.logInfo)(`Creating "${appName}" with template: ${options.template}, package manager: ${options.packageManager}${options.rspack ? ', bundler: rspack' : ''}${modeLabel}`);
     (0, create_app_js_1.createApp)(appName, options);
 }
 const program = new commander_1.Command();
@@ -81,28 +93,31 @@ program
     .option('-t, --template <type>', 'javascript or typescript', 'typescript')
     .option('-p, --package-manager <pm>', 'npm or pnpm (auto-detected if not specified)')
     .option('--rspack', 'Use Rspack instead of Webpack (~20x faster builds)', false)
+    .option('--pro', 'Generate React on Rails Pro setup (installs react_on_rails_pro)', false)
     .option('--rsc', 'Generate React Server Components setup (installs react_on_rails_pro)', false)
     .addHelpText('after', `
 Examples:
   $ npx create-react-on-rails-app my-app
   $ npx create-react-on-rails-app my-app --template javascript
   $ npx create-react-on-rails-app my-app --rspack
+  $ npx create-react-on-rails-app my-app --pro
   $ npx create-react-on-rails-app my-app --rsc
+  $ npx create-react-on-rails-app my-app --rspack --pro
   $ npx create-react-on-rails-app my-app --rspack --rsc
   $ npx create-react-on-rails-app my-app --package-manager pnpm
 
 What it does:
   1. Creates a new Rails app with PostgreSQL
-  2. Adds required gem(s) (react_on_rails, plus react_on_rails_pro for --rsc)
+  2. Adds required gem(s) (react_on_rails, plus react_on_rails_pro for --pro/--rsc)
   3. Runs the React on Rails generator (Shakapacker, components, webpack config)
 
 After setup, run bin/dev and visit:
-  - http://localhost:3000/hello_world (default)
+  - http://localhost:3000/hello_world (default and --pro)
   - http://localhost:3000/hello_server (--rsc)
 
---rsc supports both JavaScript and TypeScript templates.
+--pro and --rsc support both JavaScript and TypeScript templates.
 
-Documentation: https://www.shakacode.com/react-on-rails/docs/`)
+Documentation: https://reactonrails.com/docs/`)
     .action((appName, opts) => {
     try {
         run(appName, opts);

package/lib/types.d.ts

@@ -2,6 +2,7 @@ export interface CliOptions {
     template: 'javascript' | 'typescript';
     packageManager: 'npm' | 'pnpm';
     rspack: boolean;
+    pro: boolean;
     rsc: boolean;
 }
 export interface ValidationResult {

package/lib/utils.d.ts

@@ -5,7 +5,7 @@
  * - This uses `spawnSync` with `shell: false`, so command and args are passed as literal tokens.
  * - Callers must still ensure `command` and `args` come from trusted/validated values.
  */
-export declare function execLiveArgs(command: string, args: string[], cwd?: string): void;
+export declare function execLiveArgs(command: string, args: string[], cwd?: string, env?: NodeJS.ProcessEnv): void;
 export declare function getCommandVersion(command: string): string | null;
 export declare function detectPackageManager(): 'npm' | 'pnpm' | null;
 export declare function logStep(current: number, total: number, message: string): void;

package/lib/utils.js

@@ -20,10 +20,11 @@ const chalk_1 = __importDefault(require("chalk"));
  * - This uses `spawnSync` with `shell: false`, so command and args are passed as literal tokens.
  * - Callers must still ensure `command` and `args` come from trusted/validated values.
  */
-function execLiveArgs(command, args, cwd) {
+function execLiveArgs(command, args, cwd, env) {
     const result = (0, child_process_1.spawnSync)(command, args, {
         stdio: 'inherit',
         cwd,
+        ...(env ? { env } : {}),
     });
     if (result.error) {
         throw result.error;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-react-on-rails-app",
-  "version": "16.4.0",
+  "version": "16.5.0",
   "description": "Create React on Rails applications with a single command",
   "bin": {
     "create-react-on-rails-app": "./bin/create-react-on-rails-app.js"