@ohos-ports/nx 17.3.2-beta.0

package/src/command-line/init/implementation/dot-nx/nxw.js

@@ -0,0 +1,116 @@
+"use strict";
+// This file should be committed to your repository! It wraps Nx and ensures
+// that your local installation matches nx.json.
+// See: https://nx.dev/recipes/installation/install-non-javascript for more info.
+//
+//# The contents of this file are executed before packages are installed.
+//# As such, we should not import anything from nx, other @nrwl packages,
+//# or any other npm packages. Only import node builtins. Type Imports are
+//# fine, since they are removed by the typescript compiler.
+Object.defineProperty(exports, "__esModule", { value: true });
+const fs = require('fs');
+const path = require('path');
+const cp = require('child_process');
+const installationPath = path.join(__dirname, 'installation', 'package.json');
+function matchesCurrentNxInstall(currentInstallation, nxJsonInstallation) {
+    if (!currentInstallation.devDependencies ||
+        !Object.keys(currentInstallation.devDependencies).length) {
+        return false;
+    }
+    try {
+        if (currentInstallation.devDependencies['nx'] !==
+            nxJsonInstallation.version ||
+            require(path.join(path.dirname(installationPath), 'node_modules', 'nx', 'package.json')).version !== nxJsonInstallation.version) {
+            return false;
+        }
+        for (const [plugin, desiredVersion] of Object.entries(nxJsonInstallation.plugins || {})) {
+            if (currentInstallation.devDependencies[plugin] !== desiredVersion) {
+                return false;
+            }
+        }
+        return true;
+    }
+    catch {
+        return false;
+    }
+}
+function ensureDir(p) {
+    if (!fs.existsSync(p)) {
+        fs.mkdirSync(p, { recursive: true });
+    }
+}
+function getCurrentInstallation() {
+    try {
+        return require(installationPath);
+    }
+    catch {
+        return {
+            name: 'nx-installation',
+            version: '0.0.0',
+            devDependencies: {},
+        };
+    }
+}
+function performInstallation(currentInstallation, nxJson) {
+    fs.writeFileSync(installationPath, JSON.stringify({
+        name: 'nx-installation',
+        devDependencies: {
+            nx: nxJson.installation.version,
+            ...nxJson.installation.plugins,
+        },
+    }));
+    try {
+        cp.execSync('npm i', {
+            cwd: path.dirname(installationPath),
+            stdio: 'inherit',
+        });
+    }
+    catch (e) {
+        // revert possible changes to the current installation
+        fs.writeFileSync(installationPath, JSON.stringify(currentInstallation));
+        // rethrow
+        throw e;
+    }
+}
+function ensureUpToDateInstallation() {
+    const nxJsonPath = path.join(__dirname, '..', 'nx.json');
+    let nxJson;
+    try {
+        nxJson = require(nxJsonPath);
+        if (!nxJson.installation) {
+            console.error('[NX]: The "installation" entry in the "nx.json" file is required when running the nx wrapper. See https://nx.dev/recipes/installation/install-non-javascript');
+            process.exit(1);
+        }
+    }
+    catch {
+        console.error('[NX]: The "nx.json" file is required when running the nx wrapper. See https://nx.dev/recipes/installation/install-non-javascript');
+        process.exit(1);
+    }
+    try {
+        ensureDir(path.join(__dirname, 'installation'));
+        const currentInstallation = getCurrentInstallation();
+        if (!matchesCurrentNxInstall(currentInstallation, nxJson.installation)) {
+            performInstallation(currentInstallation, nxJson);
+        }
+    }
+    catch (e) {
+        const messageLines = [
+            '[NX]: Nx wrapper failed to synchronize installation.',
+        ];
+        if (e instanceof Error) {
+            messageLines.push('');
+            messageLines.push(e.message);
+            messageLines.push(e.stack);
+        }
+        else {
+            messageLines.push(e.toString());
+        }
+        console.error(messageLines.join('\n'));
+        process.exit(1);
+    }
+}
+if (!process.env.NX_WRAPPER_SKIP_INSTALL) {
+    ensureUpToDateInstallation();
+}
+// eslint-disable-next-line no-restricted-modules
+require('./installation/node_modules/nx/bin/nx');

package/src/command-line/init/implementation/react/add-craco-commands-to-package-scripts.d.ts

@@ -0,0 +1 @@
+export declare function addCracoCommandsToPackageScripts(appName: string, isStandalone: boolean): void;

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

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.addCracoCommandsToPackageScripts = void 0;
+const fileutils_1 = require("../../../../utils/fileutils");
+function addCracoCommandsToPackageScripts(appName, isStandalone) {
+    const packageJsonPath = isStandalone
+        ? 'package.json'
+        : `apps/${appName}/package.json`;
+    const distPath = isStandalone
+        ? `dist/${appName}`
+        : `../../dist/apps/${appName}`;
+    const packageJson = (0, fileutils_1.readJsonFile)(packageJsonPath);
+    packageJson.scripts = {
+        ...packageJson.scripts,
+        start: 'nx exec -- craco start',
+        serve: 'npm start',
+        build: `cross-env BUILD_PATH=${distPath} nx exec -- craco build`,
+        test: 'nx exec -- craco test',
+    };
+    (0, fileutils_1.writeJsonFile)(packageJsonPath, packageJson);
+}
+exports.addCracoCommandsToPackageScripts = addCracoCommandsToPackageScripts;

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

@@ -0,0 +1 @@
+export declare function addViteCommandsToPackageScripts(appName: string, isStandalone: boolean): void;

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

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.addViteCommandsToPackageScripts = void 0;
+const fileutils_1 = require("../../../../utils/fileutils");
+function addViteCommandsToPackageScripts(appName, isStandalone) {
+    const packageJsonPath = isStandalone
+        ? 'package.json'
+        : `apps/${appName}/package.json`;
+    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',
+    };
+    (0, fileutils_1.writeJsonFile)(packageJsonPath, packageJson, { spaces: 2 });
+}
+exports.addViteCommandsToPackageScripts = addViteCommandsToPackageScripts;

package/src/command-line/init/implementation/react/check-for-custom-webpack-setup.d.ts

@@ -0,0 +1 @@
+export declare function checkForCustomWebpackSetup(): void;

package/src/command-line/init/implementation/react/check-for-custom-webpack-setup.js

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.checkForCustomWebpackSetup = void 0;
+const fileutils_1 = require("../../../../utils/fileutils");
+function checkForCustomWebpackSetup() {
+    const packageJson = (0, fileutils_1.readJsonFile)('package.json');
+    const combinedDeps = {
+        ...packageJson.dependencies,
+        ...packageJson.devDependencies,
+    };
+    ['react-app-rewired', '@craco/craco'].forEach((pkg) => {
+        if (combinedDeps[pkg]) {
+            console.log(`Skipping migration due to custom webpack setup. Found "${pkg}" usage. Use --force to continue anyway.`);
+            process.exit(1);
+        }
+    });
+}
+exports.checkForCustomWebpackSetup = checkForCustomWebpackSetup;

package/src/command-line/init/implementation/react/check-for-uncommitted-changes.d.ts

@@ -0,0 +1 @@
+export declare function checkForUncommittedChanges(): void;

package/src/command-line/init/implementation/react/check-for-uncommitted-changes.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.checkForUncommittedChanges = void 0;
+const child_process_1 = require("child_process");
+function checkForUncommittedChanges() {
+    const gitResult = (0, child_process_1.execSync)(`git status --porcelain`);
+    if (gitResult.length > 0) {
+        console.log('❗️ Careful!');
+        console.log('You have uncommitted changes in your repository.');
+        console.log('');
+        console.log(gitResult.toString());
+        console.log('Please commit your changes before running the migrator!');
+        process.exit(1);
+    }
+}
+exports.checkForUncommittedChanges = checkForUncommittedChanges;

package/src/command-line/init/implementation/react/clean-up-files.d.ts

@@ -0,0 +1 @@
+export declare function cleanUpFiles(appName: string, isStandalone: boolean): void;

package/src/command-line/init/implementation/react/clean-up-files.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.cleanUpFiles = void 0;
+const fs_extra_1 = require("fs-extra");
+const fileutils_1 = require("../../../../utils/fileutils");
+function cleanUpFiles(appName, isStandalone) {
+    // Delete targets from project since we delegate to npm scripts.
+    const projectJsonPath = isStandalone
+        ? 'project.json'
+        : `apps/${appName}/project.json`;
+    const json = (0, fileutils_1.readJsonFile)(projectJsonPath);
+    delete json.targets;
+    if (isStandalone) {
+        if (json.sourceRoot) {
+            json.sourceRoot = json.sourceRoot.replace(`apps/${appName}/`, '');
+        }
+        if (json['$schema']) {
+            json['$schema'] = json['$schema'].replace('../../node_modules', 'node_modules');
+        }
+    }
+    (0, fileutils_1.writeJsonFile)(projectJsonPath, json);
+    (0, fs_extra_1.removeSync)('temp-workspace');
+    if (isStandalone) {
+        (0, fs_extra_1.removeSync)('babel.config.json');
+        (0, fs_extra_1.removeSync)('jest.preset.js');
+        (0, fs_extra_1.removeSync)('jest.config.ts');
+        (0, fs_extra_1.removeSync)('libs');
+        (0, fs_extra_1.removeSync)('tools');
+    }
+}
+exports.cleanUpFiles = cleanUpFiles;

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

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

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

@@ -0,0 +1,230 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.addNxToCraRepo = void 0;
+const child_process_1 = require("child_process");
+const fs_extra_1 = require("fs-extra");
+const path_1 = require("path");
+const fileutils_1 = require("../../../../utils/fileutils");
+const output_1 = require("../../../../utils/output");
+const package_manager_1 = require("../../../../utils/package-manager");
+const utils_1 = require("../utils");
+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)();
+        (0, check_for_custom_webpack_setup_1.checkForCustomWebpackSetup)();
+    }
+    output_1.output.log({ title: '🐳 Nx initialization' });
+    const normalizedOptions = await normalizeOptions(options);
+    await reorgnizeWorkspaceStructure(normalizedOptions);
+}
+exports.addNxToCraRepo = addNxToCraRepo;
+function installDependencies(options) {
+    const dependencies = [
+        '@testing-library/jest-dom',
+        'eslint-config-react-app',
+        'web-vitals',
+        'jest-watch-typeahead',
+    ];
+    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],
+    });
+}
+async function normalizeOptions(options) {
+    const packageManager = (0, package_manager_1.detectPackageManager)();
+    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').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] });
+    (0, child_process_1.execSync)(`echo "dist" >> .gitignore`, { stdio: [0, 1, 2] });
+    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);
+    const buildCommand = options.integrated
+        ? `npx nx build ${options.reactAppName}`
+        : 'npm run build';
+    (0, utils_1.printFinalMessage)({
+        learnMoreLink: 'https://nx.dev/recipes/react/migration-cra',
+        bodyLines: [
+            `- Execute "${buildCommand}" twice to see the computation caching in action.`,
+        ],
+    });
+    output_1.output.note({
+        title: 'First time using Nx? Check out this interactive Nx tutorial.',
+        bodyLines: [
+            `https://nx.dev/react-tutorial/1-code-generation`,
+            ` `,
+            `Prefer watching videos? Check out this free Nx course on Egghead.io.`,
+            `https://egghead.io/playlists/scale-react-development-with-nx-4038`,
+        ],
+    });
+    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, fs_extra_1.removeSync)('temp-workspace');
+    (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=cypress' : '--e2eTestRunner=none'}`, { stdio: [0, 1, 2] });
+    output_1.output.log({ title: '👋 Welcome to Nx!' });
+    output_1.output.log({ title: '🧹 Clearing unused files' });
+    (0, fs_extra_1.copySync)((0, path_1.join)('temp-workspace', 'apps', options.reactAppName, 'project.json'), 'project.json');
+    (0, fs_extra_1.removeSync)((0, path_1.join)('temp-workspace', 'apps', options.reactAppName));
+    (0, fs_extra_1.removeSync)('node_modules');
+}
+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 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,
+    ];
+    const optionalCraFiles = ['README.md'];
+    const filesToMove = [...requiredCraFiles, ...optionalCraFiles].filter(Boolean);
+    filesToMove.forEach((f) => {
+        try {
+            (0, fs_extra_1.moveSync)(f, options.isStandalone
+                ? (0, path_1.join)('temp-workspace', f)
+                : (0, path_1.join)('temp-workspace', 'apps', options.reactAppName, f), {
+                overwrite: true,
+            });
+        }
+        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);
+        (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] });
+    }
+}
+function copyFromTempWorkspaceToRoot() {
+    output_1.output.log({ title: '🚚 Folder restructuring.' });
+    (0, fs_extra_1.readdirSync)('temp-workspace').forEach((f) => {
+        (0, fs_extra_1.moveSync)((0, path_1.join)('temp-workspace', f), f, { overwrite: true });
+    });
+}
+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, fs_extra_1.removeSync)('apps');
+    }
+}

package/src/command-line/init/implementation/react/read-name-from-package-json.d.ts

@@ -0,0 +1 @@
+export declare function readNameFromPackageJson(): string;

package/src/command-line/init/implementation/react/read-name-from-package-json.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.readNameFromPackageJson = void 0;
+const fileutils_1 = require("../../../../utils/fileutils");
+function readNameFromPackageJson() {
+    let appName = 'webapp';
+    if ((0, fileutils_1.fileExists)('package.json')) {
+        const json = (0, fileutils_1.readJsonFile)('package.json');
+        if (json['name'] &&
+            json['name'].length &&
+            json['name'].replace(/\s/g, '').length) {
+            appName = json['name'].replace(/\s/g, '');
+        }
+    }
+    return appName;
+}
+exports.readNameFromPackageJson = readNameFromPackageJson;

package/src/command-line/init/implementation/react/rename-js-to-jsx.d.ts

@@ -0,0 +1 @@
+export declare function renameJsToJsx(appName: string, isStandalone: boolean): void;

package/src/command-line/init/implementation/react/rename-js-to-jsx.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.renameJsToJsx = void 0;
+const fs_extra_1 = require("fs-extra");
+const workspace_context_1 = require("../../../../utils/workspace-context");
+const fileutils_1 = require("../../../../utils/fileutils");
+// Vite cannot process JSX like <div> or <Header> unless the file is named .jsx or .tsx
+function renameJsToJsx(appName, isStandalone) {
+    const files = (0, workspace_context_1.globWithWorkspaceContext)(process.cwd(), [
+        isStandalone ? 'src/**/*.js' : `apps/${appName}/src/**/*.js`,
+    ]);
+    files.forEach((file) => {
+        if ((0, fileutils_1.fileExists)(file)) {
+            const content = (0, fs_extra_1.readFileSync)(file).toString();
+            // Try to detect JSX before renaming to .jsx
+            // Files like setupTests.js from CRA should not be renamed
+            if (/<[a-zA-Z0-9]+/.test(content)) {
+                (0, fs_extra_1.renameSync)(file, `${file}x`);
+            }
+        }
+    });
+}
+exports.renameJsToJsx = renameJsToJsx;

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

@@ -0,0 +1 @@
+export declare function setupTsConfig(appName: string, isStandalone: boolean): void;

package/src/command-line/init/implementation/react/tsconfig-setup.js

@@ -0,0 +1,109 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.setupTsConfig = void 0;
+const path_1 = require("path");
+const fileutils_1 = require("../../../../utils/fileutils");
+const defaultTsConfig = (relativePathToRoot) => ({
+    extends: relativePathToRoot
+        ? (0, path_1.join)(relativePathToRoot, 'tsconfig.base.json')
+        : './tsconfig.base.json',
+    compilerOptions: {
+        jsx: 'react',
+        allowJs: true,
+        esModuleInterop: true,
+        allowSyntheticDefaultImports: true,
+    },
+    files: [],
+    include: [],
+    references: [
+        {
+            path: './tsconfig.app.json',
+        },
+        {
+            path: './tsconfig.spec.json',
+        },
+    ],
+});
+const defaultTsConfigApp = (relativePathToRoot) => ({
+    extends: './tsconfig.json',
+    compilerOptions: {
+        outDir: (0, path_1.join)(relativePathToRoot, 'dist/out-tsc'),
+        types: ['node'],
+    },
+    files: [
+        (0, path_1.join)(relativePathToRoot, 'node_modules/@nx/react/typings/cssmodule.d.ts'),
+        (0, path_1.join)(relativePathToRoot, 'node_modules/@nx/react/typings/image.d.ts'),
+    ],
+    exclude: ['**/*.spec.ts', '**/*.spec.tsx'],
+    include: ['**/*.js', '**/*.jsx', '**/*.ts', '**/*.tsx'],
+});
+const defaultTsConfigSpec = (relativePathToRoot) => ({
+    extends: './tsconfig.json',
+    compilerOptions: {
+        outDir: (0, path_1.join)(relativePathToRoot, 'dist/out-tsc'),
+        module: 'commonjs',
+        types: ['jest', 'node'],
+    },
+    include: [
+        '**/*.spec.ts',
+        '**/*.spec.tsx',
+        '**/*.spec.js',
+        '**/*.spec.jsx',
+        '**/*.d.ts',
+    ],
+    files: [
+        (0, path_1.join)(relativePathToRoot, 'node_modules/@nx/react/typings/cssmodule.d.ts'),
+        (0, path_1.join)(relativePathToRoot, 'node_modules/@nx/react/typings/image.d.ts'),
+    ],
+});
+function setupTsConfig(appName, isStandalone) {
+    const tsconfigPath = isStandalone
+        ? 'tsconfig.json'
+        : `apps/${appName}/tsconfig.json`;
+    const tsconfigAppPath = isStandalone
+        ? 'tsconfig.app.json'
+        : `apps/${appName}/tsconfig.app.json`;
+    const tsconfiSpecPath = isStandalone
+        ? 'tsconfig.spec.json'
+        : `apps/${appName}/tsconfig.spec.json`;
+    const tsconfigBasePath = isStandalone
+        ? './tsconfig.base.json'
+        : '../../tsconfig.base.json';
+    const relativePathToRoot = isStandalone ? '' : '../../';
+    if ((0, fileutils_1.fileExists)(tsconfigPath)) {
+        const json = (0, fileutils_1.readJsonFile)(tsconfigPath);
+        json.extends = tsconfigBasePath;
+        if (json.compilerOptions) {
+            json.compilerOptions.jsx = 'react';
+        }
+        else {
+            json.compilerOptions = {
+                jsx: 'react',
+                allowJs: true,
+                esModuleInterop: true,
+                allowSyntheticDefaultImports: true,
+            };
+        }
+        (0, fileutils_1.writeJsonFile)(tsconfigPath, json);
+    }
+    else {
+        (0, fileutils_1.writeJsonFile)(tsconfigPath, defaultTsConfig(relativePathToRoot));
+    }
+    if ((0, fileutils_1.fileExists)(tsconfigAppPath)) {
+        const json = (0, fileutils_1.readJsonFile)(tsconfigAppPath);
+        json.extends = './tsconfig.json';
+        (0, fileutils_1.writeJsonFile)(tsconfigAppPath, json);
+    }
+    else {
+        (0, fileutils_1.writeJsonFile)(tsconfigAppPath, defaultTsConfigApp(relativePathToRoot));
+    }
+    if ((0, fileutils_1.fileExists)(tsconfiSpecPath)) {
+        const json = (0, fileutils_1.readJsonFile)(tsconfiSpecPath);
+        json.extends = './tsconfig.json';
+        (0, fileutils_1.writeJsonFile)(tsconfiSpecPath, json);
+    }
+    else {
+        (0, fileutils_1.writeJsonFile)(tsconfiSpecPath, defaultTsConfigSpec(relativePathToRoot));
+    }
+}
+exports.setupTsConfig = setupTsConfig;

package/src/command-line/init/implementation/react/write-craco-config.d.ts

@@ -0,0 +1 @@
+export declare function writeCracoConfig(appName: string, isCRA5: boolean, isStandalone: boolean): void;