@nx/react-native 20.4.0-beta.0 → 20.4.0-beta.2

package/.eslintrc.json

@@ -52,6 +52,10 @@
           {
             "name": "fs-extra",
             "message": "Please use equivalent utilities from `node:fs` instead."
+          },
+          {
+            "name": "chalk",
+            "message": "Please use `picocolors` in place of `chalk` for rendering terminal colors"
           }
         ]
       }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nx/react-native",
-  "version": "20.4.0-beta.0",
+  "version": "20.4.0-beta.2",
   "private": false,
   "description": "The Nx Plugin for React Native contains generators for managing React Native applications and libraries within an Nx workspace. It provides: \n\n-Integration with libraries such as Jest, Detox, and Storybook.\n-Scaffolding for creating buildable libraries that can be published to npm.\n-Utilities for automatic workspace refactoring.",
   "keywords": [
@@ -27,21 +27,21 @@
   "types": "index.d.ts",
   "dependencies": {
     "ajv": "^8.12.0",
-    "chalk": "^4.1.0",
     "enhanced-resolve": "^5.8.3",
     "glob": "7.1.4",
     "ignore": "^5.0.4",
     "metro-config": "~0.80.4",
     "metro-resolver": "~0.80.4",
     "node-fetch": "^2.6.7",
+    "picocolors": "^1.1.0",
     "tsconfig-paths": "^4.1.2",
     "tslib": "^2.3.0",
-    "@nx/devkit": "20.4.0-beta.0",
-    "@nx/jest": "20.4.0-beta.0",
-    "@nx/js": "20.4.0-beta.0",
-    "@nx/eslint": "20.4.0-beta.0",
-    "@nx/react": "20.4.0-beta.0",
-    "@nx/workspace": "20.4.0-beta.0"
+    "@nx/devkit": "20.4.0-beta.2",
+    "@nx/jest": "20.4.0-beta.2",
+    "@nx/js": "20.4.0-beta.2",
+    "@nx/eslint": "20.4.0-beta.2",
+    "@nx/react": "20.4.0-beta.2",
+    "@nx/workspace": "20.4.0-beta.2"
   },
   "executors": "./executors.json",
   "ng-update": {

package/plugins/metro-resolver.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.getResolveRequest = getResolveRequest;
 const metroResolver = require("metro-resolver");
 const tsconfig_paths_1 = require("tsconfig-paths");
-const chalk = require("chalk");
+const pc = require("picocolors");
 const enhanced_resolve_1 = require("enhanced-resolve");
 const path_1 = require("path");
 const fs = require("fs");
@@ -26,9 +26,9 @@ function getResolveRequest(extensions, exportsConditionNames = [], mainFields =
             return resolvedPath;
         }
         if (debug) {
-            console.log(chalk.red(`[Nx] Unable to resolve with any resolver: ${realModuleName}`));
+            console.log(pc.red(`[Nx] Unable to resolve with any resolver: ${realModuleName}`));
         }
-        throw new Error(`Cannot resolve ${chalk.bold(realModuleName)}`);
+        throw new Error(`Cannot resolve ${pc.bold(realModuleName)}`);
     };
 }
 function resolveRequestFromContext(resolveRequest, context, realModuleName, platform, debug) {
@@ -37,7 +37,7 @@ function resolveRequestFromContext(resolveRequest, context, realModuleName, plat
     }
     catch {
         if (debug)
-            console.log(chalk.cyan(`[Nx] Unable to resolve with default resolveRequest: ${realModuleName}`));
+            console.log(pc.cyan(`[Nx] Unable to resolve with default resolveRequest: ${realModuleName}`));
     }
 }
 /**
@@ -50,7 +50,7 @@ function defaultMetroResolver(context, realModuleName, platform, debug) {
     }
     catch {
         if (debug)
-            console.log(chalk.cyan(`[Nx] Unable to resolve with default Metro resolver: ${realModuleName}`));
+            console.log(pc.cyan(`[Nx] Unable to resolve with default Metro resolver: ${realModuleName}`));
     }
 }
 /**
@@ -69,7 +69,7 @@ function pnpmResolver(extensions, context, realModuleName, debug, exportsConditi
     }
     catch {
         if (debug)
-            console.log(chalk.cyan(`[Nx] Unable to resolve with default PNPM resolver: ${realModuleName}`));
+            console.log(pc.cyan(`[Nx] Unable to resolve with default PNPM resolver: ${realModuleName}`));
     }
 }
 /**
@@ -84,8 +84,8 @@ function tsconfigPathsResolver(context, extensions, realModuleName, platform, de
     }
     catch {
         if (debug) {
-            console.log(chalk.cyan(`[Nx] Failed to resolve ${chalk.bold(realModuleName)}`));
-            console.log(chalk.cyan(`[Nx] The following tsconfig paths was used:\n:${chalk.bold(JSON.stringify(paths, null, 2))}`));
+            console.log(pc.cyan(`[Nx] Failed to resolve ${pc.bold(realModuleName)}`));
+            console.log(pc.cyan(`[Nx] The following tsconfig paths was used:\n:${pc.bold(JSON.stringify(paths, null, 2))}`));
         }
     }
 }
@@ -99,13 +99,13 @@ function getMatcher(debug) {
             absoluteBaseUrl = result.absoluteBaseUrl;
             paths = result.paths;
             if (debug) {
-                console.log(chalk.cyan(`[Nx] Located tsconfig at ${chalk.bold(absoluteBaseUrl)}`));
-                console.log(chalk.cyan(`[Nx] Found the following paths:\n:${chalk.bold(JSON.stringify(paths, null, 2))}`));
+                console.log(pc.cyan(`[Nx] Located tsconfig at ${pc.bold(absoluteBaseUrl)}`));
+                console.log(pc.cyan(`[Nx] Found the following paths:\n:${pc.bold(JSON.stringify(paths, null, 2))}`));
             }
             matcher = (0, tsconfig_paths_1.createMatchPath)(absoluteBaseUrl, paths);
         }
         else {
-            console.log(chalk.cyan(`[Nx] Failed to locate tsconfig}`));
+            console.log(pc.cyan(`[Nx] Failed to locate tsconfig}`));
             throw new Error(`Could not load tsconfig for project`);
         }
     }

package/src/executors/storybook/storybook.impl.js

@@ -6,7 +6,7 @@ const node_fs_1 = require("node:fs");
 const path_1 = require("path");
 const devkit_1 = require("@nx/devkit");
 const fileutils_1 = require("@nx/workspace/src/utilities/fileutils");
-const chalk = require("chalk");
+const pc = require("picocolors");
 const glob_1 = require("glob");
 const sync_deps_impl_1 = require("../sync-deps/sync-deps.impl");
 /**
@@ -16,7 +16,7 @@ const sync_deps_impl_1 = require("../sync-deps/sync-deps.impl");
 async function* reactNativeStorybookExecutor(options, context) {
     const { syncDeps: isSyncDepsEnabled = true } = options;
     const projectRoot = context.projectsConfigurations.projects[context.projectName].root;
-    devkit_1.logger.info(`${chalk.bold.cyan('info')} To see your Storybook stories on the device, you should start your mobile app for the <platform> of your choice (typically ios or android).`);
+    devkit_1.logger.info(`${pc.bold(pc.cyan('info'))} To see your Storybook stories on the device, you should start your mobile app for the <platform> of your choice (typically ios or android).`);
     // add storybook addons to app's package.json
     const packageJsonPath = (0, path_1.join)(context.root, projectRoot, 'package.json');
     const workspacePackageJsonPath = (0, path_1.join)(context.root, 'package.json');
@@ -44,7 +44,7 @@ function runCliStorybook(workspaceRoot, options) {
         });
     });
     if (storiesFiles.length === 0) {
-        devkit_1.logger.warn(`${chalk.bold.yellow('warn')} No stories found.`);
+        devkit_1.logger.warn(`${pc.bold(pc.yellow('warn'))} No stories found.`);
     }
     const newContents = `// Auto-generated file created by nx
 // DO NOT EDIT.

package/src/executors/sync-deps/sync-deps.impl.js

@@ -4,7 +4,7 @@ exports.default = syncDepsExecutor;
 exports.syncDeps = syncDeps;
 exports.displayNewlyAddedDepsMessage = displayNewlyAddedDepsMessage;
 const path_1 = require("path");
-const chalk = require("chalk");
+const pc = require("picocolors");
 const devkit_1 = require("@nx/devkit");
 const find_all_npm_dependencies_1 = require("../../utils/find-all-npm-dependencies");
 async function* syncDepsExecutor(options, context) {
@@ -68,10 +68,10 @@ async function syncDeps(projectName, projectPackageJson, projectPackageJsonPath,
 }
 function displayNewlyAddedDepsMessage(projectName, deps) {
     if (deps.length > 0) {
-        devkit_1.logger.info(`${chalk.bold.cyan('info')} Added entries to 'package.json' for '${projectName}' (for autolink):
-  ${deps.map((d) => chalk.bold.cyan(`"${d}": "*"`)).join('\n  ')}`);
+        devkit_1.logger.info(`${pc.bold(pc.cyan('info'))} Added entries to 'package.json' for '${projectName}' (for autolink):
+  ${deps.map((d) => pc.bold(pc.cyan(`"${d}": "*"`))).join('\n  ')}`);
     }
     else {
-        devkit_1.logger.info(`${chalk.bold.cyan('info')} Dependencies for '${projectName}' are up to date! No changes made.`);
+        devkit_1.logger.info(`${pc.bold(pc.cyan('info'))} Dependencies for '${projectName}' are up to date! No changes made.`);
     }
 }

package/src/generators/application/application.js

@@ -18,6 +18,7 @@ const add_e2e_1 = require("./lib/add-e2e");
 const ensure_dependencies_1 = require("../../utils/ensure-dependencies");
 const sync_deps_impl_1 = require("../../executors/sync-deps/sync-deps.impl");
 const ts_solution_setup_1 = require("@nx/js/src/utils/typescript/ts-solution-setup");
+const sort_fields_1 = require("@nx/js/src/utils/package-json/sort-fields");
 async function reactNativeApplicationGenerator(host, schema) {
     return await reactNativeApplicationGeneratorInternal(host, {
         addPlugin: false,
@@ -31,6 +32,7 @@ async function reactNativeApplicationGeneratorInternal(host, schema) {
         skipFormat: true,
         addTsPlugin: schema.useTsSolution,
         formatter: schema.formatter,
+        platform: 'web',
     });
     tasks.push(jsInitTask);
     const options = await (0, normalize_options_1.normalizeOptions)(host, schema);
@@ -49,11 +51,11 @@ async function reactNativeApplicationGeneratorInternal(host, schema) {
         ],
     });
     tasks.push(lintTask);
-    const jestTask = await (0, add_jest_1.addJest)(host, options.unitTestRunner, options.projectName, options.appProjectRoot, options.js, options.skipPackageJson, options.addPlugin);
+    const jestTask = await (0, add_jest_1.addJest)(host, options.unitTestRunner, options.projectName, options.appProjectRoot, options.js, options.skipPackageJson, options.addPlugin, 'tsconfig.app.json');
     tasks.push(jestTask);
     const webTask = await (0, web_configuration_1.webConfigurationGenerator)(host, {
         ...options,
-        project: options.name,
+        project: options.projectName,
         skipFormat: true,
     });
     tasks.push(webTask);
@@ -91,6 +93,7 @@ async function reactNativeApplicationGeneratorInternal(host, schema) {
     if (options.useTsSolution) {
         (0, ts_solution_setup_1.addProjectToTsSolutionWorkspace)(host, options.appProjectRoot);
     }
+    (0, sort_fields_1.sortPackageJsonFields)(host, options.appProjectRoot);
     if (!options.skipFormat) {
         await (0, devkit_1.formatFiles)(host);
     }

package/src/generators/application/lib/add-project.js

@@ -3,7 +3,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.addProject = addProject;
 const devkit_1 = require("@nx/devkit");
 const ts_solution_setup_1 = require("@nx/js/src/utils/typescript/ts-solution-setup");
-const get_import_path_1 = require("@nx/js/src/utils/get-import-path");
 function addProject(host, options) {
     const nxJson = (0, devkit_1.readNxJson)(host);
     const hasPlugin = nxJson.plugins?.some((p) => typeof p === 'string'
@@ -18,13 +17,10 @@ function addProject(host, options) {
     };
     if ((0, ts_solution_setup_1.isUsingTsSolutionSetup)(host)) {
         (0, devkit_1.writeJson)(host, (0, devkit_1.joinPathFragments)(options.appProjectRoot, 'package.json'), {
-            name: (0, get_import_path_1.getImportPath)(host, options.name),
+            name: options.projectName,
             version: '0.0.1',
             private: true,
             nx: {
-                name: options.name,
-                projectType: 'application',
-                sourceRoot: `${options.appProjectRoot}/src`,
                 targets: hasPlugin ? {} : getTargets(options),
                 tags: options.parsedTags?.length ? options.parsedTags : undefined,
             },

package/src/generators/application/lib/normalize-options.js

@@ -4,6 +4,7 @@ exports.normalizeOptions = normalizeOptions;
 const devkit_1 = require("@nx/devkit");
 const project_name_and_root_utils_1 = require("@nx/devkit/src/generators/project-name-and-root-utils");
 const ts_solution_setup_1 = require("@nx/js/src/utils/typescript/ts-solution-setup");
+const get_import_path_1 = require("@nx/js/src/utils/get-import-path");
 async function normalizeOptions(host, options) {
     await (0, project_name_and_root_utils_1.ensureProjectName)(host, options, 'application');
     const { projectName: appProjectName, names: projectNames, projectRoot: appProjectRoot, } = await (0, project_name_and_root_utils_1.determineProjectNameAndRootOptions)(host, {
@@ -25,6 +26,7 @@ async function normalizeOptions(host, options) {
         ? options.tags.split(',').map((s) => s.trim())
         : [];
     const entryFile = options.js ? 'src/main.js' : 'src/main.tsx';
+    const isTsSolutionSetup = (0, ts_solution_setup_1.isUsingTsSolutionSetup)(host);
     return {
         ...options,
         name: projectNames.projectSimpleName,
@@ -32,7 +34,9 @@ async function normalizeOptions(host, options) {
         fileName,
         lowerCaseName: className.toLowerCase(),
         displayName: options.displayName || className,
-        projectName: appProjectName,
+        projectName: isTsSolutionSetup
+            ? (0, get_import_path_1.getImportPath)(host, appProjectName)
+            : appProjectName,
         appProjectRoot,
         iosProjectRoot,
         androidProjectRoot,
@@ -41,6 +45,6 @@ async function normalizeOptions(host, options) {
         rootProject,
         e2eProjectName,
         e2eProjectRoot,
-        isTsSolutionSetup: (0, ts_solution_setup_1.isUsingTsSolutionSetup)(host),
+        isTsSolutionSetup,
     };
 }

package/src/generators/component/component.js

@@ -6,6 +6,7 @@ const normalize_options_1 = require("./lib/normalize-options");
 const add_import_1 = require("./lib/add-import");
 const ensure_typescript_1 = require("@nx/js/src/utils/typescript/ensure-typescript");
 const path_1 = require("path");
+const ts_solution_setup_1 = require("@nx/js/src/utils/typescript/ts-solution-setup");
 async function reactNativeComponentGenerator(host, schema) {
     const options = await (0, normalize_options_1.normalizeOptions)(host, schema);
     createComponentFiles(host, options);
@@ -27,7 +28,8 @@ function addExportsToBarrel(host, options) {
         tsModule = (0, ensure_typescript_1.ensureTypescript)();
     }
     const workspace = (0, devkit_1.getProjects)(host);
-    const isApp = workspace.get(options.projectName).projectType === 'application';
+    const proj = workspace.get(options.projectName);
+    const isApp = (0, ts_solution_setup_1.getProjectType)(host, proj.root, proj.projectType) === 'application';
     if (options.export && !isApp) {
         const indexFilePath = (0, devkit_1.joinPathFragments)(options.projectSourceRoot, options.fileExtensionType === 'js' ? 'index.js' : 'index.ts');
         if (!host.exists(indexFilePath)) {

package/src/generators/component/lib/normalize-options.js

@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.normalizeOptions = normalizeOptions;
 const devkit_1 = require("@nx/devkit");
 const artifact_name_and_directory_utils_1 = require("@nx/devkit/src/generators/artifact-name-and-directory-utils");
+const ts_solution_setup_1 = require("@nx/js/src/utils/typescript/ts-solution-setup");
 async function normalizeOptions(host, options) {
     const { artifactName: name, directory, fileName, filePath, fileExtension, fileExtensionType, project: projectName, } = await (0, artifact_name_and_directory_utils_1.determineArtifactNameAndDirectoryOptions)(host, {
         path: options.path,
@@ -13,8 +14,9 @@ async function normalizeOptions(host, options) {
     });
     const project = (0, devkit_1.getProjects)(host).get(projectName);
     const { className } = (0, devkit_1.names)(name);
-    const { sourceRoot: projectSourceRoot, projectType } = project;
-    if (options.export && projectType === 'application') {
+    const { root, sourceRoot: projectSourceRoot, projectType } = project;
+    if (options.export &&
+        (0, ts_solution_setup_1.getProjectType)(host, root, projectType) === 'application') {
         devkit_1.logger.warn(`The "--export" option should not be used with applications and will do nothing.`);
     }
     options.classComponent = options.classComponent ?? false;

package/src/generators/library/lib/normalize-options.js

@@ -4,6 +4,7 @@ exports.normalizeOptions = normalizeOptions;
 const devkit_1 = require("@nx/devkit");
 const project_name_and_root_utils_1 = require("@nx/devkit/src/generators/project-name-and-root-utils");
 const ts_solution_setup_1 = require("@nx/js/src/utils/typescript/ts-solution-setup");
+const get_import_path_1 = require("@nx/js/src/utils/get-import-path");
 async function normalizeOptions(host, options) {
     await (0, project_name_and_root_utils_1.ensureProjectName)(host, options, 'library');
     const { projectName, names: projectNames, projectRoot, importPath, } = await (0, project_name_and_root_utils_1.determineProjectNameAndRootOptions)(host, {
@@ -19,15 +20,18 @@ async function normalizeOptions(host, options) {
     const parsedTags = options.tags
         ? options.tags.split(',').map((s) => s.trim())
         : [];
+    const isUsingTsSolutionConfig = (0, ts_solution_setup_1.isUsingTsSolutionSetup)(host);
     const normalized = {
         ...options,
         fileName: projectName,
         routePath: `/${projectNames.projectSimpleName}`,
-        name: projectName,
+        name: isUsingTsSolutionConfig
+            ? (0, get_import_path_1.getImportPath)(host, projectName)
+            : projectName,
         projectRoot,
         parsedTags,
         importPath,
-        isUsingTsSolutionConfig: (0, ts_solution_setup_1.isUsingTsSolutionSetup)(host),
+        isUsingTsSolutionConfig,
     };
     return normalized;
 }

package/src/generators/library/library.js

@@ -12,7 +12,7 @@ const normalize_options_1 = require("./lib/normalize-options");
 const ensure_dependencies_1 = require("../../utils/ensure-dependencies");
 const log_show_project_command_1 = require("@nx/devkit/src/utils/log-show-project-command");
 const ts_solution_setup_1 = require("@nx/js/src/utils/typescript/ts-solution-setup");
-const get_import_path_1 = require("@nx/js/src/utils/get-import-path");
+const sort_fields_1 = require("@nx/js/src/utils/package-json/sort-fields");
 async function reactNativeLibraryGenerator(host, schema) {
     return await reactNativeLibraryGeneratorInternal(host, {
         addPlugin: false,
@@ -48,7 +48,7 @@ async function reactNativeLibraryGeneratorInternal(host, schema) {
         ],
     });
     tasks.push(lintTask);
-    const jestTask = await (0, add_jest_1.addJest)(host, options.unitTestRunner, options.name, options.projectRoot, options.js, options.skipPackageJson, options.addPlugin);
+    const jestTask = await (0, add_jest_1.addJest)(host, options.unitTestRunner, options.name, options.projectRoot, options.js, options.skipPackageJson, options.addPlugin, 'tsconfig.lib.json');
     tasks.push(jestTask);
     if (options.publishable || options.buildable) {
         updateLibPackageNpmScope(host, options);
@@ -68,6 +68,7 @@ async function reactNativeLibraryGeneratorInternal(host, schema) {
     if (options.isUsingTsSolutionConfig) {
         (0, ts_solution_setup_1.addProjectToTsSolutionWorkspace)(host, options.projectRoot);
     }
+    (0, sort_fields_1.sortPackageJsonFields)(host, options.projectRoot);
     if (!options.skipFormat) {
         await (0, devkit_1.formatFiles)(host);
     }
@@ -90,14 +91,11 @@ async function addProject(host, options) {
     };
     const packageJsonPath = (0, devkit_1.joinPathFragments)(options.projectRoot, 'package.json');
     if (options.isUsingTsSolutionConfig) {
-        (0, devkit_1.writeJson)(host, packageJsonPath, {
-            name: (0, get_import_path_1.getImportPath)(host, options.name),
+        (0, devkit_1.writeJson)(host, (0, devkit_1.joinPathFragments)(options.projectRoot, 'package.json'), {
+            name: options.name,
             version: '0.0.1',
             ...determineEntryFields(options),
             nx: {
-                name: options.name,
-                sourceRoot: (0, devkit_1.joinPathFragments)(options.projectRoot, 'src'),
-                projectType: 'library',
                 tags: options.parsedTags?.length ? options.parsedTags : undefined,
             },
         });

package/src/utils/add-jest.d.ts

@@ -1,2 +1,2 @@
 import { Tree } from '@nx/devkit';
-export declare function addJest(host: Tree, unitTestRunner: 'jest' | 'none', projectName: string, appProjectRoot: string, js: boolean, skipPackageJson: boolean, addPlugin: boolean): Promise<import("@nx/devkit").GeneratorCallback>;
+export declare function addJest(host: Tree, unitTestRunner: 'jest' | 'none', projectName: string, appProjectRoot: string, js: boolean, skipPackageJson: boolean, addPlugin: boolean, runtimeTsconfigFileName: string): Promise<import("@nx/devkit").GeneratorCallback>;

package/src/utils/add-jest.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.addJest = addJest;
 const devkit_1 = require("@nx/devkit");
 const jest_1 = require("@nx/jest");
-async function addJest(host, unitTestRunner, projectName, appProjectRoot, js, skipPackageJson, addPlugin) {
+async function addJest(host, unitTestRunner, projectName, appProjectRoot, js, skipPackageJson, addPlugin, runtimeTsconfigFileName) {
     if (unitTestRunner !== 'jest') {
         return () => { };
     }
@@ -17,6 +17,7 @@ async function addJest(host, unitTestRunner, projectName, appProjectRoot, js, sk
         skipPackageJson,
         skipFormat: true,
         addPlugin,
+        runtimeTsconfigFileName,
     });
     // overwrite the jest.config.ts file because react native needs to have special transform property
     const configPath = `${appProjectRoot}/jest.config.${js ? 'js' : 'ts'}`;

package/src/utils/pod-install-task.js

@@ -6,17 +6,17 @@ const child_process_1 = require("child_process");
 const node_fs_1 = require("node:fs");
 const os_1 = require("os");
 const path_1 = require("path");
-const chalk = require("chalk");
+const pc = require("picocolors");
 const devkit_1 = require("@nx/devkit");
 const podInstallErrorMessage = `
-Running ${chalk.bold('pod install')} failed, see above.
+Running ${pc.bold('pod install')} failed, see above.
 Do you have CocoaPods (https://cocoapods.org/) installed?
 
 Check that your XCode path is correct:
-${chalk.bold('sudo xcode-select --print-path')}
+${pc.bold('sudo xcode-select --print-path')}
 
 If the path is wrong, switch the path: (your path may be different)
-${chalk.bold('sudo xcode-select --switch /Applications/Xcode.app')}
+${pc.bold('sudo xcode-select --switch /Applications/Xcode.app')}
 `;
 /**
  * Run pod install on ios directory