nx 20.5.0-beta.3 → 20.5.0-beta.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nx",
-  "version": "20.5.0-beta.3",
+  "version": "20.5.0-beta.5",
   "private": false,
   "description": "The core Nx plugin contains the core functionality of Nx like the project graph, nx commands and task orchestration.",
   "repository": {
@@ -82,16 +82,16 @@
     }
   },
   "optionalDependencies": {
-    "@nx/nx-darwin-arm64": "20.5.0-beta.3",
-    "@nx/nx-darwin-x64": "20.5.0-beta.3",
-    "@nx/nx-freebsd-x64": "20.5.0-beta.3",
-    "@nx/nx-linux-arm-gnueabihf": "20.5.0-beta.3",
-    "@nx/nx-linux-arm64-gnu": "20.5.0-beta.3",
-    "@nx/nx-linux-arm64-musl": "20.5.0-beta.3",
-    "@nx/nx-linux-x64-gnu": "20.5.0-beta.3",
-    "@nx/nx-linux-x64-musl": "20.5.0-beta.3",
-    "@nx/nx-win32-arm64-msvc": "20.5.0-beta.3",
-    "@nx/nx-win32-x64-msvc": "20.5.0-beta.3"
+    "@nx/nx-darwin-arm64": "20.5.0-beta.5",
+    "@nx/nx-darwin-x64": "20.5.0-beta.5",
+    "@nx/nx-freebsd-x64": "20.5.0-beta.5",
+    "@nx/nx-linux-arm-gnueabihf": "20.5.0-beta.5",
+    "@nx/nx-linux-arm64-gnu": "20.5.0-beta.5",
+    "@nx/nx-linux-arm64-musl": "20.5.0-beta.5",
+    "@nx/nx-linux-x64-gnu": "20.5.0-beta.5",
+    "@nx/nx-linux-x64-musl": "20.5.0-beta.5",
+    "@nx/nx-win32-arm64-msvc": "20.5.0-beta.5",
+    "@nx/nx-win32-x64-msvc": "20.5.0-beta.5"
   },
   "nx-migrations": {
     "migrations": "./migrations.json",

package/schemas/nx-schema.json

@@ -21,6 +21,10 @@
       "additionalProperties": false,
       "deprecated": "Use `defaultBase` instead. Support for setting `defaultBase` in `affected` will be removed in Nx 20."
     },
+    "extends": {
+      "type": "string",
+      "description": "Specifies the base config to extend."
+    },
     "defaultBase": {
       "type": "string",
       "description": "Default --base used by affected logic."
@@ -169,7 +173,22 @@
                 ]
               },
               "releaseTagPattern": {
-                "type": "string"
+                "type": "string",
+                "description": "Optionally override the git/release tag pattern to use for this group."
+              },
+              "releaseTagPatternCheckAllBranchesWhen": {
+                "oneOf": [
+                  {
+                    "type": "boolean"
+                  },
+                  {
+                    "type": "array",
+                    "items": {
+                      "type": "string"
+                    }
+                  }
+                ],
+                "description": "By default, we will try and resolve the latest match for the releaseTagPattern from the current branch, falling back to all branches if no match is found on the current branch. Setting this to true will cause us to ALWAYS check all branches for the latest match. Setting it to false will cause us to ONLY check the current branch for the latest match. Setting it to an array of strings will cause us to check all branches WHEN the current branch is one of the strings in the array. Glob patterns are supported."
               },
               "versionPlans": {
                 "oneOf": [
@@ -243,7 +262,22 @@
           ]
         },
         "releaseTagPattern": {
-          "type": "string"
+          "type": "string",
+          "description": "Optionally override the git/release tag pattern to use. This field is the source of truth for changelog generation and release tagging, as well as for conventional commits parsing. It supports interpolating the version as {version} and (if releasing independently or forcing project level version control system releases) the project name as {projectName} within the string. The default releaseTagPattern for fixed/unified releases is: \"v{version}\". The default releaseTagPattern for independent releases at the project level is: \"{projectName}@{version}\""
+        },
+        "releaseTagPatternCheckAllBranchesWhen": {
+          "oneOf": [
+            {
+              "type": "boolean"
+            },
+            {
+              "type": "array",
+              "items": {
+                "type": "string"
+              }
+            }
+          ],
+          "description": "By default, we will try and resolve the latest match for the releaseTagPattern from the current branch, falling back to all branches if no match is found on the current branch. Setting this to true will cause us to ALWAYS check all branches for the latest match. Setting it to false will cause us to ONLY check the current branch for the latest match. Setting it to an array of strings will cause us to check all branches WHEN the current branch is one of the strings in the array. Glob patterns are supported."
         }
       }
     },

package/src/command-line/add/add.js

@@ -5,7 +5,6 @@ exports.addHandler = addHandler;
 const child_process_1 = require("child_process");
 const fs_1 = require("fs");
 const ora = require("ora");
-const yargsParser = require("yargs-parser");
 const nx_json_1 = require("../../config/nx-json");
 const child_process_2 = require("../../utils/child-process");
 const fileutils_1 = require("../../utils/fileutils");
@@ -79,27 +78,18 @@ async function installPackage(pkgName, version, nxJson) {
     spinner.succeed();
 }
 async function initializePlugin(pkgName, options, nxJson) {
-    const parsedCommandArgs = yargsParser(options.__overrides_unparsed__, {
-        configuration: {
-            'parse-numbers': false,
-            'parse-positional-numbers': false,
-            'dot-notation': false,
-            'camel-case-expansion': false,
-        },
-    });
-    if (exports.coreNxPluginVersions.has(pkgName)) {
-        parsedCommandArgs.keepExistingVersions = true;
-        if (options.updatePackageScripts ||
+    let updatePackageScripts = false;
+    if (exports.coreNxPluginVersions.has(pkgName) &&
+        (options.updatePackageScripts ||
             (options.updatePackageScripts === undefined &&
                 nxJson.useInferencePlugins !== false &&
-                process.env.NX_ADD_PLUGINS !== 'false')) {
-            parsedCommandArgs.updatePackageScripts = true;
-        }
+                process.env.NX_ADD_PLUGINS !== 'false'))) {
+        updatePackageScripts = true;
     }
     const spinner = ora(`Initializing ${pkgName}...`);
     spinner.start();
     try {
-        await (0, configure_plugins_1.installPlugin)(pkgName, workspace_root_1.workspaceRoot, options.verbose, parsedCommandArgs);
+        await (0, configure_plugins_1.installPlugin)(pkgName, workspace_root_1.workspaceRoot, updatePackageScripts, options.verbose);
     }
     catch (e) {
         spinner.fail();

package/src/command-line/init/command-object.js

@@ -46,6 +46,11 @@ async function withInitOptions(yargs) {
             type: 'boolean',
             description: 'Initialize an Nx workspace setup in the .nx directory of the current repository.',
             default: false,
+        })
+            .option('force', {
+            describe: 'Force the migration to continue and ignore custom webpack setup or uncommitted changes. Only for CRA projects.',
+            type: 'boolean',
+            default: false,
         });
     }
     else {

package/src/command-line/init/configure-plugins.d.ts

@@ -4,19 +4,18 @@ export declare function runPackageManagerInstallPlugins(repoRoot: string, pmc: P
  * Installs a plugin by running its init generator. It will change the file system tree passed in.
  * @param plugin The name of the plugin to install
  * @param repoRoot repo root
- * @param verbose verbose
- * @param options options passed to init generator
+ * @param pmc package manager commands
+ * @param updatePackageScripts whether to update package scripts
+ * @param verbose whether to run in verbose mode
  * @returns void
  */
-export declare function installPlugin(plugin: string, repoRoot: string, verbose: boolean, options: {
-    [k: string]: any;
-}): Promise<void>;
+export declare function installPlugin(plugin: string, repoRoot?: string, updatePackageScripts?: boolean, verbose?: boolean, pmc?: PackageManagerCommands): Promise<void>;
 /**
  * Install plugins
  * Get the implementation of the plugin's init generator and run it
  * @returns a list of succeeded plugins and a map of failed plugins to errors
  */
-export declare function installPlugins(plugins: string[], updatePackageScripts: boolean, repoRoot?: string, verbose?: boolean): Promise<{
+export declare function installPlugins(plugins: string[], updatePackageScripts: boolean, pmc: PackageManagerCommands, repoRoot?: string, verbose?: boolean): Promise<{
     succeededPlugins: string[];
     failedPlugins: {
         [plugin: string]: Error;

package/src/command-line/init/configure-plugins.js

@@ -7,10 +7,9 @@ exports.configurePlugins = configurePlugins;
 exports.getFailedToInstallPluginErrorMessages = getFailedToInstallPluginErrorMessages;
 const createSpinner = require("ora");
 const chalk_1 = require("chalk");
+const child_process_1 = require("child_process");
 const package_manager_1 = require("../../utils/package-manager");
 const output_1 = require("../../utils/output");
-const tree_1 = require("../../generators/tree");
-const generator_utils_1 = require("../generate/generator-utils");
 const workspace_root_1 = require("../../utils/workspace-root");
 const utils_1 = require("./implementation/utils");
 const plugins_1 = require("../../utils/plugins");
@@ -27,12 +26,12 @@ function runPackageManagerInstallPlugins(repoRoot, pmc = (0, package_manager_1.g
  * Installs a plugin by running its init generator. It will change the file system tree passed in.
  * @param plugin The name of the plugin to install
  * @param repoRoot repo root
- * @param verbose verbose
- * @param options options passed to init generator
+ * @param pmc package manager commands
+ * @param updatePackageScripts whether to update package scripts
+ * @param verbose whether to run in verbose mode
  * @returns void
  */
-async function installPlugin(plugin, repoRoot = workspace_root_1.workspaceRoot, verbose = false, options) {
-    const host = new tree_1.FsTree(repoRoot, verbose, `install ${plugin}`);
+async function installPlugin(plugin, repoRoot = workspace_root_1.workspaceRoot, updatePackageScripts = false, verbose = false, pmc = (0, package_manager_1.getPackageManagerCommand)()) {
     const capabilities = await (0, plugins_1.getPluginCapabilities)(repoRoot, plugin, {});
     const generators = capabilities?.generators;
     if (!generators) {
@@ -45,20 +44,18 @@ async function installPlugin(plugin, repoRoot = workspace_root_1.workspaceRoot,
         });
         return;
     }
-    const { implementationFactory } = (0, generator_utils_1.getGeneratorInformation)(plugin, initGenerator, repoRoot, {});
-    const implementation = implementationFactory();
-    const task = await implementation(host, options);
-    (0, tree_1.flushChanges)(repoRoot, host.listChanges());
-    if (task) {
-        await task();
-    }
+    (0, child_process_1.execSync)(`${pmc.exec} nx g ${plugin}:init --keepExistingVersions ${updatePackageScripts ? '--updatePackageScripts' : ''} ${verbose ? '--verbose' : ''}`, {
+        stdio: [0, 1, 2],
+        cwd: repoRoot,
+        windowsHide: false,
+    });
 }
 /**
  * Install plugins
  * Get the implementation of the plugin's init generator and run it
  * @returns a list of succeeded plugins and a map of failed plugins to errors
  */
-async function installPlugins(plugins, updatePackageScripts, repoRoot = workspace_root_1.workspaceRoot, verbose = false) {
+async function installPlugins(plugins, updatePackageScripts, pmc, repoRoot = workspace_root_1.workspaceRoot, verbose = false) {
     if (plugins.length === 0) {
         return {
             succeededPlugins: [],
@@ -71,13 +68,7 @@ async function installPlugins(plugins, updatePackageScripts, repoRoot = workspac
     for (const plugin of plugins) {
         try {
             spinner.start('Installing plugin ' + plugin);
-            await installPlugin(plugin, repoRoot, verbose, {
-                keepExistingVersions: true,
-                updatePackageScripts,
-                addPlugin: true,
-                skipFormat: false,
-                skipPackageJson: false,
-            });
+            await installPlugin(plugin, repoRoot, updatePackageScripts, verbose, pmc);
             succeededPlugins.push(plugin);
             spinner.succeed('Installed plugin ' + plugin);
         }
@@ -103,7 +94,7 @@ async function configurePlugins(plugins, updatePackageScripts, pmc, repoRoot = w
         };
     }
     output_1.output.log({ title: '🔨 Configuring plugins' });
-    let { succeededPlugins, failedPlugins } = await installPlugins(plugins, updatePackageScripts, repoRoot, verbose);
+    let { succeededPlugins, failedPlugins } = await installPlugins(plugins, updatePackageScripts, pmc, repoRoot, verbose);
     if (succeededPlugins.length > 0) {
         output_1.output.success({
             title: 'Installed Plugins',

package/src/command-line/init/implementation/react/add-vite-commands-to-package-scripts.js

@@ -9,10 +9,12 @@ function addViteCommandsToPackageScripts(appName, isStandalone) {
     const packageJson = (0, fileutils_1.readJsonFile)(packageJsonPath);
     packageJson.scripts = {
         ...packageJson.scripts,
-        start: 'nx exec -- vite',
-        serve: 'nx exec -- vite',
-        build: `nx exec -- vite build`,
-        test: 'nx exec -- vitest',
+        // These should be replaced by the vite init generator later.
+        start: 'vite',
+        test: 'vitest',
+        dev: 'vite',
+        build: 'vite build',
+        eject: undefined,
     };
     (0, fileutils_1.writeJsonFile)(packageJsonPath, packageJson, { spaces: 2 });
 }

package/src/command-line/init/implementation/react/index.d.ts

@@ -1,4 +1,4 @@
 import { InitArgs } from '../../init-v1';
 type Options = InitArgs;
-export declare function addNxToCraRepo(options: Options): Promise<void>;
+export declare function addNxToCraRepo(_options: Options): Promise<void>;
 export {};

package/src/command-line/init/implementation/react/index.js

@@ -2,43 +2,52 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.addNxToCraRepo = addNxToCraRepo;
 const child_process_1 = require("child_process");
-const node_fs_1 = require("node:fs");
 const path_1 = require("path");
+const fs_1 = require("fs");
 const fileutils_1 = require("../../../../utils/fileutils");
 const output_1 = require("../../../../utils/output");
 const package_manager_1 = require("../../../../utils/package-manager");
 const check_for_custom_webpack_setup_1 = require("./check-for-custom-webpack-setup");
-const check_for_uncommitted_changes_1 = require("./check-for-uncommitted-changes");
-const clean_up_files_1 = require("./clean-up-files");
 const read_name_from_package_json_1 = require("./read-name-from-package-json");
 const rename_js_to_jsx_1 = require("./rename-js-to-jsx");
-const tsconfig_setup_1 = require("./tsconfig-setup");
-const write_craco_config_1 = require("./write-craco-config");
 const write_vite_config_1 = require("./write-vite-config");
 const write_vite_index_html_1 = require("./write-vite-index-html");
-const connect_to_nx_cloud_1 = require("../../../connect/connect-to-nx-cloud");
-async function addNxToCraRepo(options) {
-    if (!options.force) {
-        (0, check_for_uncommitted_changes_1.checkForUncommittedChanges)();
+async function addNxToCraRepo(_options) {
+    if (!_options.force) {
         (0, check_for_custom_webpack_setup_1.checkForCustomWebpackSetup)();
     }
-    output_1.output.log({ title: '🐳 Nx initialization' });
-    const normalizedOptions = await normalizeOptions(options);
-    await reorgnizeWorkspaceStructure(normalizedOptions);
+    const options = await normalizeOptions(_options);
+    await addBundler(options);
+    (0, fs_1.appendFileSync)(`.gitignore`, '\nnode_modules');
+    (0, fs_1.appendFileSync)(`.gitignore`, '\ndist');
+    installDependencies(options);
+    // Vite expects index.html to be in the root as the main entry point.
+    const indexPath = options.isStandalone
+        ? 'index.html'
+        : (0, path_1.join)('apps', options.reactAppName, 'index.html');
+    const oldIndexPath = options.isStandalone
+        ? (0, path_1.join)('public', 'index.html')
+        : (0, path_1.join)('apps', options.reactAppName, 'public', 'index.html');
+    output_1.output.note({
+        title: `A new ${indexPath} has been created. Compare it to the previous ${oldIndexPath} file and make any changes needed, then delete the previous file.`,
+    });
+    if (_options.force) {
+        output_1.output.note({
+            title: `Using --force converts projects with custom Webpack setup. You will need to manually update your vite.config.js file to match the plugins used in your old Webpack configuration.`,
+        });
+    }
 }
 function installDependencies(options) {
     const dependencies = [
+        '@rollup/plugin-replace',
         '@testing-library/jest-dom',
+        '@vitejs/plugin-react',
         'eslint-config-react-app',
         'web-vitals',
         'jest-watch-typeahead',
+        'vite',
+        'vitest',
     ];
-    if (options.isVite) {
-        dependencies.push('vite', 'vitest', '@vitejs/plugin-react');
-    }
-    else {
-        dependencies.push('@craco/craco', 'cross-env', 'react-scripts', 'tsconfig-paths-webpack-plugin');
-    }
     (0, child_process_1.execSync)(`${options.pmc.addDev} ${dependencies.join(' ')}`, {
         stdio: [0, 1, 2],
         windowsHide: false,
@@ -49,182 +58,20 @@ async function normalizeOptions(options) {
     const pmc = (0, package_manager_1.getPackageManagerCommand)(packageManager);
     const appIsJs = !(0, fileutils_1.fileExists)(`tsconfig.json`);
     const reactAppName = (0, read_name_from_package_json_1.readNameFromPackageJson)();
-    const packageJson = (0, fileutils_1.readJsonFile)((0, path_1.join)(process.cwd(), 'package.json'));
-    const deps = {
-        ...packageJson.dependencies,
-        ...packageJson.devDependencies,
-    };
-    const isCRA5 = /^[^~]?5/.test(deps['react-scripts']);
-    const npmVersion = (0, child_process_1.execSync)('npm -v', {
-        windowsHide: false,
-    }).toString();
-    // Should remove this check 04/2023 once Node 14 & npm 6 reach EOL
-    const npxYesFlagNeeded = !npmVersion.startsWith('6'); // npm 7 added -y flag to npx
-    const isVite = options.vite;
     const isStandalone = !options.integrated;
-    const nxCloud = options.nxCloud ??
-        (options.interactive ? await (0, connect_to_nx_cloud_1.connectExistingRepoToNxCloudPrompt)() : false);
     return {
         ...options,
-        nxCloud,
         packageManager,
         pmc,
         appIsJs,
         reactAppName,
-        isCRA5,
-        npxYesFlagNeeded,
-        isVite,
         isStandalone,
     };
 }
-/**
- * - Create a temp workspace
- * - Move all files to temp workspace
- * - Add bundler to temp workspace
- * - Move files back to root
- * - Clean up unused files
- */
-async function reorgnizeWorkspaceStructure(options) {
-    createTempWorkspace(options);
-    moveFilesToTempWorkspace(options);
-    await addBundler(options);
-    output_1.output.log({ title: '🧶  Updating .gitignore file' });
-    (0, child_process_1.execSync)(`echo "node_modules" >> .gitignore`, {
-        stdio: [0, 1, 2],
-        windowsHide: false,
-    });
-    (0, child_process_1.execSync)(`echo "dist" >> .gitignore`, {
-        stdio: [0, 1, 2],
-        windowsHide: false,
-    });
-    process.chdir('..');
-    copyFromTempWorkspaceToRoot();
-    cleanUpUnusedFilesAndAddConfigFiles(options);
-    output_1.output.log({ title: '🙂 Please be patient, one final step remaining!' });
-    output_1.output.log({ title: '📦 Installing dependencies' });
-    installDependencies(options);
-    if (options.isVite) {
-        const indexPath = options.isStandalone
-            ? 'index.html'
-            : (0, path_1.join)('apps', options.reactAppName, 'index.html');
-        const oldIndexPath = options.isStandalone
-            ? (0, path_1.join)('public', 'index.html')
-            : (0, path_1.join)('apps', options.reactAppName, 'public', 'index.html');
-        output_1.output.note({
-            title: `A new ${indexPath} has been created. Compare it to the previous ${oldIndexPath} file and make any changes needed, then delete the previous file.`,
-        });
-    }
-}
-function createTempWorkspace(options) {
-    (0, node_fs_1.rmSync)('temp-workspace', { recursive: true, force: true });
-    (0, child_process_1.execSync)(`npx ${options.npxYesFlagNeeded ? '-y' : ''} create-nx-workspace@latest temp-workspace --appName=${options.reactAppName} --preset=react-monorepo --style=css --bundler=${options.isVite ? 'vite' : 'webpack'} --packageManager=${options.packageManager} ${options.nxCloud ? '--nxCloud=yes' : '--nxCloud=skip'} ${options.addE2e ? '--e2eTestRunner=playwright' : '--e2eTestRunner=none'}`, { stdio: [0, 1, 2], windowsHide: false });
-    output_1.output.log({ title: '👋 Welcome to Nx!' });
-    output_1.output.log({ title: '🧹 Clearing unused files' });
-    (0, node_fs_1.cpSync)((0, path_1.join)('temp-workspace', 'apps', options.reactAppName, 'project.json'), 'project.json', { recursive: true });
-    (0, node_fs_1.rmSync)((0, path_1.join)('temp-workspace', 'apps', options.reactAppName), {
-        recursive: true,
-        force: true,
-    });
-    (0, node_fs_1.rmSync)('node_modules', { recursive: true, force: true });
-}
-function copyPackageJsonDepsFromTempWorkspace() {
-    const repoRoot = process.cwd();
-    let rootPackageJson = (0, fileutils_1.readJsonFile)((0, path_1.join)(repoRoot, 'package.json'));
-    const tempWorkspacePackageJson = (0, fileutils_1.readJsonFile)((0, path_1.join)(repoRoot, 'temp-workspace', 'package.json'));
-    rootPackageJson = overridePackageDeps('dependencies', rootPackageJson, tempWorkspacePackageJson);
-    rootPackageJson = overridePackageDeps('devDependencies', rootPackageJson, tempWorkspacePackageJson);
-    rootPackageJson.scripts = {}; // remove existing scripts
-    (0, fileutils_1.writeJsonFile)((0, path_1.join)(repoRoot, 'package.json'), rootPackageJson);
-    (0, fileutils_1.writeJsonFile)((0, path_1.join)(repoRoot, 'temp-workspace', 'package.json'), rootPackageJson);
-}
-function overridePackageDeps(depConfigName, base, override) {
-    if (!base[depConfigName]) {
-        base[depConfigName] = override[depConfigName];
-        return base;
-    }
-    const deps = override[depConfigName];
-    Object.keys(deps).forEach((dep) => {
-        if (base.dependencies?.[dep]) {
-            delete base.dependencies[dep];
-        }
-        if (base.devDependencies?.[dep]) {
-            delete base.devDependencies[dep];
-        }
-        base[depConfigName][dep] = deps[dep];
-    });
-    return base;
-}
-function moveSync(src, dest) {
-    const destParentDir = (0, path_1.dirname)(dest);
-    (0, node_fs_1.mkdirSync)(destParentDir, { recursive: true });
-    (0, node_fs_1.rmSync)(dest, { recursive: true, force: true });
-    return (0, node_fs_1.renameSync)(src, dest);
-}
-function moveFilesToTempWorkspace(options) {
-    output_1.output.log({ title: '🚚 Moving your React app in your new Nx workspace' });
-    copyPackageJsonDepsFromTempWorkspace();
-    const requiredCraFiles = [
-        'project.json',
-        'package.json',
-        'src',
-        'public',
-        options.appIsJs ? null : 'tsconfig.json',
-        options.packageManager === 'yarn' ? 'yarn.lock' : null,
-        options.packageManager === 'pnpm' ? 'pnpm-lock.yaml' : null,
-        options.packageManager === 'npm' ? 'package-lock.json' : null,
-        options.packageManager === 'bun' ? 'bun.lockb' : null,
-    ];
-    const optionalCraFiles = ['README.md'];
-    const filesToMove = [...requiredCraFiles, ...optionalCraFiles].filter(Boolean);
-    filesToMove.forEach((f) => {
-        try {
-            moveSync(f, options.isStandalone
-                ? (0, path_1.join)('temp-workspace', f)
-                : (0, path_1.join)('temp-workspace', 'apps', options.reactAppName, f));
-        }
-        catch (error) {
-            if (requiredCraFiles.includes(f)) {
-                throw error;
-            }
-        }
-    });
-    process.chdir('temp-workspace');
-}
 async function addBundler(options) {
-    if (options.isVite) {
-        output_1.output.log({ title: '🧑‍🔧  Setting up Vite' });
-        const { addViteCommandsToPackageScripts } = await Promise.resolve().then(() => require('./add-vite-commands-to-package-scripts'));
-        addViteCommandsToPackageScripts(options.reactAppName, options.isStandalone);
-        (0, write_vite_config_1.writeViteConfig)(options.reactAppName, options.isStandalone, options.appIsJs);
-        (0, write_vite_index_html_1.writeViteIndexHtml)(options.reactAppName, options.isStandalone, options.appIsJs);
-        await (0, rename_js_to_jsx_1.renameJsToJsx)(options.reactAppName, options.isStandalone);
-    }
-    else {
-        output_1.output.log({ title: '🧑‍🔧  Setting up craco + Webpack' });
-        const { addCracoCommandsToPackageScripts } = await Promise.resolve().then(() => require('./add-craco-commands-to-package-scripts'));
-        addCracoCommandsToPackageScripts(options.reactAppName, options.isStandalone);
-        (0, write_craco_config_1.writeCracoConfig)(options.reactAppName, options.isCRA5, options.isStandalone);
-        output_1.output.log({
-            title: '🛬 Skip CRA preflight check since Nx manages the monorepo',
-        });
-        (0, child_process_1.execSync)(`echo "SKIP_PREFLIGHT_CHECK=true" > .env`, {
-            stdio: [0, 1, 2],
-            windowsHide: false,
-        });
-    }
-}
-function copyFromTempWorkspaceToRoot() {
-    output_1.output.log({ title: '🚚 Folder restructuring.' });
-    (0, node_fs_1.readdirSync)('temp-workspace').forEach((f) => {
-        moveSync((0, path_1.join)('temp-workspace', f), f);
-    });
-}
-function cleanUpUnusedFilesAndAddConfigFiles(options) {
-    output_1.output.log({ title: '🧹  Cleaning up.' });
-    (0, clean_up_files_1.cleanUpFiles)(options.reactAppName, options.isStandalone);
-    output_1.output.log({ title: "📃 Extend the app's tsconfig.json from the base" });
-    (0, tsconfig_setup_1.setupTsConfig)(options.reactAppName, options.isStandalone);
-    if (options.isStandalone) {
-        (0, node_fs_1.rmSync)('apps', { recursive: true, force: true });
-    }
+    const { addViteCommandsToPackageScripts } = await Promise.resolve().then(() => require('./add-vite-commands-to-package-scripts'));
+    addViteCommandsToPackageScripts(options.reactAppName, options.isStandalone);
+    (0, write_vite_config_1.writeViteConfig)(options.reactAppName, options.isStandalone, options.appIsJs);
+    (0, write_vite_index_html_1.writeViteIndexHtml)(options.reactAppName, options.isStandalone, options.appIsJs);
+    await (0, rename_js_to_jsx_1.renameJsToJsx)(options.reactAppName, options.isStandalone);
 }

package/src/command-line/init/implementation/react/write-vite-config.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.writeViteConfig = writeViteConfig;
 const fs_1 = require("fs");
 function writeViteConfig(appName, isStandalone, isJs) {
-    let port = 4200;
+    let port = 3000;
     // Use PORT from .env file if it exists in project.
     if ((0, fs_1.existsSync)(`../.env`)) {
         const envFile = (0, fs_1.readFileSync)(`../.env`).toString();
@@ -13,8 +13,20 @@ function writeViteConfig(appName, isStandalone, isJs) {
             port = portCandidate;
         }
     }
-    (0, fs_1.writeFileSync)(isStandalone ? 'vite.config.js' : `apps/${appName}/vite.config.js`, `import { defineConfig } from 'vite'
+    (0, fs_1.writeFileSync)(isStandalone ? 'vite.config.mjs' : `apps/${appName}/vite.config.mjs`, `import { defineConfig } from 'vite'
 import react from '@vitejs/plugin-react'
+import replace from '@rollup/plugin-replace';
+import { nxViteTsPaths } from '@nx/vite/plugins/nx-tsconfig-paths.plugin';
+
+// Match CRA's environment variables.
+// TODO: Replace these with VITE_ prefixed environment variables, and using import.meta.env.VITE_* instead of process.env.REACT_APP_*.
+const craEnvVarRegex = /^REACT_APP/i;
+const craEnvVars = Object.keys(process.env)
+  .filter((key) => craEnvVarRegex.test(key))
+  .reduce((env, key) => {
+    env[\`process.env.\${key}\`] = JSON.stringify(process.env[key]);
+    return env;
+  }, {});
 
 // https://vitejs.dev/config/
 export default defineConfig({
@@ -31,7 +43,11 @@ export default defineConfig({
     setupFiles: 'src/setupTests.${isJs ? 'js' : 'ts'}',
     css: true,
   },
-  plugins: [react()],
+  plugins: [
+    react(),
+    replace({ values: craEnvVars, preventAssignment: true }),
+    nxViteTsPaths(),
+  ],
 });
 `);
 }

package/src/command-line/init/implementation/utils.d.ts

@@ -16,3 +16,4 @@ export declare function printFinalMessage({ learnMoreLink, }: {
     learnMoreLink?: string;
 }): void;
 export declare function isMonorepo(packageJson: PackageJson): boolean;
+export declare function isCRA(packageJson: PackageJson): boolean;

package/src/command-line/init/implementation/utils.js

@@ -11,6 +11,7 @@ exports.markRootPackageJsonAsNxProjectLegacy = markRootPackageJsonAsNxProjectLeg
 exports.markPackageJsonAsNxProject = markPackageJsonAsNxProject;
 exports.printFinalMessage = printFinalMessage;
 exports.isMonorepo = isMonorepo;
+exports.isCRA = isCRA;
 const child_process_1 = require("child_process");
 const path_1 = require("path");
 const fileutils_1 = require("../../../utils/fileutils");
@@ -266,3 +267,16 @@ function isMonorepo(packageJson) {
         return true;
     return false;
 }
+function isCRA(packageJson) {
+    const combinedDependencies = {
+        ...packageJson.dependencies,
+        ...packageJson.devDependencies,
+    };
+    return (
+    // Required dependencies for CRA projects
+    combinedDependencies['react'] &&
+        combinedDependencies['react-dom'] &&
+        combinedDependencies['react-scripts'] &&
+        (0, fileutils_1.directoryExists)('src') &&
+        (0, fileutils_1.directoryExists)('public'));
+}

package/src/command-line/init/init-v2.d.ts

@@ -5,6 +5,7 @@ export interface InitArgs {
     useDotNxInstallation?: boolean;
     integrated?: boolean;
     verbose?: boolean;
+    force?: boolean;
 }
 export declare function initHandler(options: InitArgs): Promise<void>;
 export declare function detectPlugins(nxJson: NxJsonConfiguration, interactive: boolean, includeAngularCli?: boolean): Promise<{