@nx/react-native 17.0.0-beta.6 → 17.0.0-rc.0

package/generators.json

@@ -24,7 +24,7 @@
       "description": "Create a React Native library."
     },
     "component": {
-      "factory": "./src/generators/component/component#reactNativeComponentGenerator",
+      "factory": "./src/generators/component/component#reactNativeComponentGeneratorInternal",
       "schema": "./src/generators/component/schema.json",
       "description": "Create a React Native component.",
       "aliases": ["c"]

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nx/react-native",
-  "version": "17.0.0-beta.6",
+  "version": "17.0.0-rc.0",
   "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": [
@@ -36,14 +36,14 @@
     "node-fetch": "^2.6.7",
     "tsconfig-paths": "^4.1.2",
     "tslib": "^2.3.0",
-    "@nx/detox": "17.0.0-beta.6",
-    "@nx/devkit": "17.0.0-beta.6",
-    "@nx/jest": "17.0.0-beta.6",
-    "@nx/js": "17.0.0-beta.6",
-    "@nx/linter": "17.0.0-beta.6",
-    "@nx/react": "17.0.0-beta.6",
-    "@nx/workspace": "17.0.0-beta.6",
-    "@nrwl/react-native": "17.0.0-beta.6"
+    "@nx/detox": "17.0.0-rc.0",
+    "@nx/devkit": "17.0.0-rc.0",
+    "@nx/jest": "17.0.0-rc.0",
+    "@nx/js": "17.0.0-rc.0",
+    "@nx/eslint": "17.0.0-rc.0",
+    "@nx/react": "17.0.0-rc.0",
+    "@nx/workspace": "17.0.0-rc.0",
+    "@nrwl/react-native": "17.0.0-rc.0"
   },
   "peerDependencies": {
     "react-native": ">= 0.72.0 < 0.73.0"

package/src/executors/build-android/build-android.impl.js

@@ -46,13 +46,7 @@ function runCliBuild(workspaceRoot, projectRoot, options) {
         });
     });
 }
-const nxOptions = ['sync', 'packager'];
 const startOptions = ['port', 'resetCache'];
-const deprecatedOptions = ['apk', 'debug', 'gradleTask'];
 function createBuildAndroidOptions(options) {
-    return (0, get_cli_options_1.getCliOptions)(options, [
-        ...nxOptions,
-        ...startOptions,
-        ...deprecatedOptions,
-    ]);
+    return (0, get_cli_options_1.getCliOptions)(options, startOptions);
 }

package/src/executors/build-android/build-android.impl.ts

@@ -66,14 +66,8 @@ function runCliBuild(
   });
 }
 
-const nxOptions = ['sync', 'packager'];
 const startOptions = ['port', 'resetCache'];
-const deprecatedOptions = ['apk', 'debug', 'gradleTask'];
 
 function createBuildAndroidOptions(options: ReactNativeBuildAndroidOptions) {
-  return getCliOptions<ReactNativeBuildAndroidOptions>(options, [
-    ...nxOptions,
-    ...startOptions,
-    ...deprecatedOptions,
-  ]);
+  return getCliOptions<ReactNativeBuildAndroidOptions>(options, startOptions);
 }

package/src/executors/build-ios/build-ios.impl.js

@@ -47,8 +47,9 @@ function runCliBuildIOS(workspaceRoot, projectRoot, options) {
         });
     });
 }
-const nxOptions = ['sync', 'install', 'packager'];
 const startOptions = ['port', 'resetCache'];
 function createBuildIOSOptions(options) {
-    return (0, get_cli_options_1.getCliOptions)(options, [...nxOptions, ...startOptions], ['buildFolder']);
+    return (0, get_cli_options_1.getCliOptions)(options, startOptions, [
+        'buildFolder',
+    ]);
 }

package/src/executors/build-ios/build-ios.impl.ts

@@ -68,13 +68,10 @@ function runCliBuildIOS(
   });
 }
 
-const nxOptions = ['sync', 'install', 'packager'];
 const startOptions = ['port', 'resetCache'];
 
 function createBuildIOSOptions(options: ReactNativeBuildIosOptions) {
-  return getCliOptions<ReactNativeBuildIosOptions>(
-    options,
-    [...nxOptions, ...startOptions],
-    ['buildFolder']
-  );
+  return getCliOptions<ReactNativeBuildIosOptions>(options, startOptions, [
+    'buildFolder',
+  ]);
 }

package/src/executors/run-android/run-android.impl.js

@@ -68,9 +68,11 @@ function runCliRunAndroid(workspaceRoot, projectRoot, options) {
         });
     });
 }
-const nxOptions = ['sync', 'packager'];
 const startOptions = ['port', 'resetCache'];
-const deprecatedOptions = ['variant', 'jetifier'];
 function createRunAndroidOptions(options) {
-    return (0, get_cli_options_1.getCliOptions)(options, [...nxOptions, ...startOptions, ...deprecatedOptions], ['appId', 'appIdSuffix', 'deviceId']);
+    return (0, get_cli_options_1.getCliOptions)(options, startOptions, [
+        'appId',
+        'appIdSuffix',
+        'deviceId',
+    ]);
 }

package/src/executors/run-android/run-android.impl.ts

@@ -92,14 +92,12 @@ function runCliRunAndroid(
   });
 }
 
-const nxOptions = ['sync', 'packager'];
 const startOptions = ['port', 'resetCache'];
-const deprecatedOptions = ['variant', 'jetifier'];
 
 function createRunAndroidOptions(options: ReactNativeRunAndroidOptions) {
-  return getCliOptions<ReactNativeRunAndroidOptions>(
-    options,
-    [...nxOptions, ...startOptions, ...deprecatedOptions],
-    ['appId', 'appIdSuffix', 'deviceId']
-  );
+  return getCliOptions<ReactNativeRunAndroidOptions>(options, startOptions, [
+    'appId',
+    'appIdSuffix',
+    'deviceId',
+  ]);
 }

package/src/executors/run-android/schema.json

@@ -54,11 +54,6 @@
       "examples": ["debug", "release"],
       "x-priority": "important"
     },
-    "packager": {
-      "type": "boolean",
-      "description": "Launch packager while building",
-      "default": true
-    },
     "port": {
       "type": "number",
       "description": "The port where the packager server is listening on.",
@@ -95,12 +90,6 @@
       "type": "boolean",
       "description": "Explicitly select build type and flavour to use before running a build"
     },
-    "sync": {
-      "type": "boolean",
-      "description": "Syncs npm dependencies to `package.json` (for React Native autolink).",
-      "x-deprecated": "Add sync-deps to dependsOn for this target in project.json instead",
-      "default": true
-    },
     "resetCache": {
       "type": "boolean",
       "description": "Resets metro cache.",

package/src/executors/run-ios/run-ios.impl.js

@@ -69,9 +69,9 @@ function runCliRunIOS(workspaceRoot, projectRoot, options) {
         });
     });
 }
-const nxOptions = ['sync', 'install', 'packager'];
 const startOptions = ['port', 'resetCache'];
-const deprecatedOptions = ['xcodeConfiguration'];
 function createRunIOSOptions(options) {
-    return (0, get_cli_options_1.getCliOptions)(options, [...nxOptions, ...startOptions, ...deprecatedOptions], ['buildFolder']);
+    return (0, get_cli_options_1.getCliOptions)(options, startOptions, [
+        'buildFolder',
+    ]);
 }

package/src/executors/run-ios/run-ios.impl.ts

@@ -92,14 +92,10 @@ function runCliRunIOS(
   });
 }
 
-const nxOptions = ['sync', 'install', 'packager'];
 const startOptions = ['port', 'resetCache'];
-const deprecatedOptions = ['xcodeConfiguration'];
 
 function createRunIOSOptions(options: ReactNativeRunIosOptions) {
-  return getCliOptions<ReactNativeRunIosOptions>(
-    options,
-    [...nxOptions, ...startOptions, ...deprecatedOptions],
-    ['buildFolder']
-  );
+  return getCliOptions<ReactNativeRunIosOptions>(options, startOptions, [
+    'buildFolder',
+  ]);
 }

package/src/executors/run-ios/schema.json

@@ -82,28 +82,11 @@
       ],
       "description": "Custom params that will be passed to xcodebuild command."
     },
-    "install": {
-      "type": "boolean",
-      "description": "Runs `pod install` for native modules before building iOS app.",
-      "default": true,
-      "x-deprecated": "Add `pod-install` to dependsOn for this target in project.json instead."
-    },
-    "sync": {
-      "type": "boolean",
-      "description": "Syncs npm dependencies to `package.json` (for React Native autolink).",
-      "x-deprecated": "Add `sync-deps` to dependsOn for this target in project.json instead.",
-      "default": true
-    },
     "resetCache": {
       "type": "boolean",
       "description": "Resets metro cache.",
       "default": false
     },
-    "packager": {
-      "type": "boolean",
-      "description": "Launch packager while building",
-      "default": true
-    },
     "binaryPath": {
       "type": "string",
       "description": "Path relative to project root where pre-built .app binary lives."

package/src/generators/application/application.spec.ts

@@ -5,7 +5,7 @@ import {
   readProjectConfiguration,
 } from '@nx/devkit';
 import { createTreeWithEmptyWorkspace } from '@nx/devkit/testing';
-import { Linter } from '@nx/linter';
+import { Linter } from '@nx/eslint';
 import { reactNativeApplicationGenerator } from './application';
 
 describe('app', () => {
@@ -18,7 +18,7 @@ describe('app', () => {
 
   it('should update configuration', async () => {
     await reactNativeApplicationGenerator(appTree, {
-      name: 'myApp',
+      name: 'my-app',
       displayName: 'myApp',
       linter: Linter.EsLint,
       e2eTestRunner: 'none',
@@ -32,7 +32,7 @@ describe('app', () => {
 
   it('should update nx.json', async () => {
     await reactNativeApplicationGenerator(appTree, {
-      name: 'myApp',
+      name: 'my-app',
       displayName: 'myApp',
       tags: 'one,two',
       linter: Linter.EsLint,
@@ -49,7 +49,7 @@ describe('app', () => {
 
   it('should generate files', async () => {
     await reactNativeApplicationGenerator(appTree, {
-      name: 'myApp',
+      name: 'my-app',
       displayName: 'myApp',
       linter: Linter.EsLint,
       e2eTestRunner: 'none',
@@ -82,7 +82,7 @@ describe('app', () => {
 
   it('should generate targets', async () => {
     await reactNativeApplicationGenerator(appTree, {
-      name: 'myApp',
+      name: 'my-app',
       displayName: 'myApp',
       linter: Linter.EsLint,
       e2eTestRunner: 'none',
@@ -97,7 +97,7 @@ describe('app', () => {
     appTree.rename('tsconfig.base.json', 'tsconfig.json');
 
     await reactNativeApplicationGenerator(appTree, {
-      name: 'myApp',
+      name: 'my-app',
       displayName: 'myApp',
       linter: Linter.EsLint,
       e2eTestRunner: 'none',
@@ -112,8 +112,8 @@ describe('app', () => {
   describe('detox', () => {
     it('should create e2e app with directory', async () => {
       await reactNativeApplicationGenerator(appTree, {
-        name: 'myApp',
-        directory: 'myDir',
+        name: 'my-app',
+        directory: 'my-dir',
         linter: Linter.EsLint,
         e2eTestRunner: 'detox',
         install: false,
@@ -163,7 +163,7 @@ describe('app', () => {
 
     it('should create e2e app without directory', async () => {
       await reactNativeApplicationGenerator(appTree, {
-        name: 'myApp',
+        name: 'my-app',
         linter: Linter.EsLint,
         e2eTestRunner: 'detox',
         install: false,
@@ -216,7 +216,7 @@ describe('app', () => {
       const packageJsonBefore = readJson(appTree, 'package.json');
 
       await reactNativeApplicationGenerator(appTree, {
-        name: 'myApp',
+        name: 'my-app',
         displayName: 'myApp',
         linter: Linter.EsLint,
         e2eTestRunner: 'none',

package/src/generators/application/files/app/metro.config.js.template

@@ -19,7 +19,7 @@ const customConfig = {
     assetExts: assetExts.filter((ext) => ext !== 'svg'),
     sourceExts: [...sourceExts, 'svg'],
     blockList: exclusionList([/^(?!.*node_modules).*\/dist\/.*/]),
-    unstable_enableSymlinks: true,
+    // unstable_enableSymlinks: true,
     // unstable_enablePackageExports: true,
   },
 };

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

@@ -2,14 +2,14 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.addDetox = void 0;
 const detox_1 = require("@nx/detox");
-const linter_1 = require("@nx/linter");
+const eslint_1 = require("@nx/eslint");
 async function addDetox(host, options) {
     if (options?.e2eTestRunner !== 'detox') {
         return () => { };
     }
     return (0, detox_1.detoxApplicationGenerator)(host, {
         ...options,
-        linter: linter_1.Linter.EsLint,
+        linter: eslint_1.Linter.EsLint,
         e2eName: `${options.projectName}-e2e`,
         e2eDirectory: `${options.appProjectRoot}-e2e`,
         projectNameAndRootFormat: 'as-provided',

package/src/generators/application/lib/{nomalize-options.spec.ts → normalize-options.spec.ts}

@@ -1,6 +1,6 @@
 import { Tree } from '@nx/devkit';
 import { createTreeWithEmptyWorkspace } from '@nx/devkit/testing';
-import { Linter } from '@nx/linter';
+import { Linter } from '@nx/eslint';
 import { Schema } from '../schema';
 import { normalizeOptions } from './normalize-options';
 
@@ -48,15 +48,15 @@ describe('Normalize Options', () => {
     };
     const options = await normalizeOptions(appTree, schema);
     expect(options).toEqual({
-      androidProjectRoot: 'my-app/android',
-      appProjectRoot: 'my-app',
+      androidProjectRoot: 'myApp/android',
+      appProjectRoot: 'myApp',
       className: 'MyApp',
       displayName: 'MyApp',
-      iosProjectRoot: 'my-app/ios',
+      iosProjectRoot: 'myApp/ios',
       lowerCaseName: 'myapp',
-      name: 'my-app',
+      name: 'myApp',
       parsedTags: [],
-      projectName: 'my-app',
+      projectName: 'myApp',
       projectNameAndRootFormat: 'as-provided',
       entryFile: 'src/main.tsx',
       e2eTestRunner: 'none',

package/src/generators/application/schema.d.ts

@@ -1,5 +1,5 @@
 import type { ProjectNameAndRootFormat } from '@nx/devkit/src/generators/project-name-and-root-utils';
-import type { Linter } from '@nx/linter';
+import type { Linter } from '@nx/eslint';
 
 export interface Schema {
   name: string;

package/src/generators/component/component.d.ts

@@ -1,4 +1,5 @@
 import { Schema } from './schema';
 import { Tree } from '@nx/devkit';
 export declare function reactNativeComponentGenerator(host: Tree, schema: Schema): Promise<void>;
+export declare function reactNativeComponentGeneratorInternal(host: Tree, schema: Schema): Promise<void>;
 export default reactNativeComponentGenerator;

package/src/generators/component/component.js

@@ -1,21 +1,27 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.reactNativeComponentGenerator = void 0;
+exports.reactNativeComponentGeneratorInternal = exports.reactNativeComponentGenerator = void 0;
 const devkit_1 = require("@nx/devkit");
 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");
 async function reactNativeComponentGenerator(host, schema) {
+    return reactNativeComponentGeneratorInternal(host, {
+        nameAndDirectoryFormat: 'derived',
+        ...schema,
+    });
+}
+exports.reactNativeComponentGenerator = reactNativeComponentGenerator;
+async function reactNativeComponentGeneratorInternal(host, schema) {
     const options = await (0, normalize_options_1.normalizeOptions)(host, schema);
     createComponentFiles(host, options);
     addExportsToBarrel(host, options);
     await (0, devkit_1.formatFiles)(host);
 }
-exports.reactNativeComponentGenerator = reactNativeComponentGenerator;
+exports.reactNativeComponentGeneratorInternal = reactNativeComponentGeneratorInternal;
 function createComponentFiles(host, options) {
-    const componentDir = (0, devkit_1.joinPathFragments)(options.projectSourceRoot, options.directory);
-    (0, devkit_1.generateFiles)(host, (0, path_1.join)(__dirname, './files'), componentDir, {
+    (0, devkit_1.generateFiles)(host, (0, path_1.join)(__dirname, './files'), options.directory, {
         ...options,
         tmpl: '',
     });
@@ -44,9 +50,15 @@ function addExportsToBarrel(host, options) {
         const indexSource = host.read(indexFilePath, 'utf-8');
         if (indexSource !== null) {
             const indexSourceFile = tsModule.createSourceFile(indexFilePath, indexSource, tsModule.ScriptTarget.Latest, true);
-            const changes = (0, devkit_1.applyChangesToString)(indexSource, (0, add_import_1.addImport)(indexSourceFile, `export * from './${options.directory}/${options.fileName}';`));
+            const relativePathFromIndex = getRelativeImportToFile(indexFilePath, options.filePath);
+            const changes = (0, devkit_1.applyChangesToString)(indexSource, (0, add_import_1.addImport)(indexSourceFile, `export * from '${relativePathFromIndex}';`));
             host.write(indexFilePath, changes);
         }
     }
 }
+function getRelativeImportToFile(indexPath, filePath) {
+    const { name, dir } = (0, path_1.parse)(filePath);
+    const relativeDirToTarget = (0, path_1.relative)((0, path_1.dirname)(indexPath), dir);
+    return `./${(0, devkit_1.joinPathFragments)(relativeDirToTarget, name)}`;
+}
 exports.default = reactNativeComponentGenerator;

package/src/generators/component/lib/normalize-options.d.ts

@@ -4,5 +4,6 @@ export interface NormalizedSchema extends Schema {
     projectSourceRoot: string;
     fileName: string;
     className: string;
+    filePath: string;
 }
 export declare function normalizeOptions(host: Tree, options: Schema): Promise<NormalizedSchema>;

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

@@ -2,17 +2,24 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.normalizeOptions = void 0;
 const devkit_1 = require("@nx/devkit");
+const artifact_name_and_directory_utils_1 = require("@nx/devkit/src/generators/artifact-name-and-directory-utils");
 async function normalizeOptions(host, options) {
     assertValidOptions(options);
-    const { className, fileName } = (0, devkit_1.names)(options.name);
-    const componentFileName = options.pascalCaseFiles ? className : fileName;
-    const project = (0, devkit_1.getProjects)(host).get(options.project);
-    if (!project) {
-        devkit_1.logger.error(`Cannot find the ${options.project} project. Please double check the project name.`);
-        throw new Error();
-    }
+    const { artifactName: name, directory, fileName, filePath, project: projectName, } = await (0, artifact_name_and_directory_utils_1.determineArtifactNameAndDirectoryOptions)(host, {
+        artifactType: 'component',
+        callingGenerator: '@nx/react-native:component',
+        name: options.name,
+        directory: options.directory,
+        derivedDirectory: options.directory,
+        flat: options.flat,
+        nameAndDirectoryFormat: options.nameAndDirectoryFormat,
+        project: options.project,
+        fileExtension: 'tsx',
+        pascalCaseFile: options.pascalCaseFiles,
+    });
+    const project = (0, devkit_1.getProjects)(host).get(projectName);
+    const { className } = (0, devkit_1.names)(name);
     const { sourceRoot: projectSourceRoot, projectType } = project;
-    const directory = await getDirectory(host, options);
     if (options.export && projectType === 'application') {
         devkit_1.logger.warn(`The "--export" option should not be used with applications and will do nothing.`);
     }
@@ -21,26 +28,12 @@ async function normalizeOptions(host, options) {
         ...options,
         directory,
         className,
-        fileName: componentFileName,
+        fileName,
+        filePath,
         projectSourceRoot,
     };
 }
 exports.normalizeOptions = normalizeOptions;
-async function getDirectory(host, options) {
-    const fileName = (0, devkit_1.names)(options.name).fileName;
-    const workspace = (0, devkit_1.getProjects)(host);
-    let baseDir;
-    if (options.directory) {
-        baseDir = options.directory;
-    }
-    else {
-        baseDir =
-            workspace.get(options.project).projectType === 'application'
-                ? 'app'
-                : 'lib';
-    }
-    return options.flat ? baseDir : (0, devkit_1.joinPathFragments)(baseDir, fileName);
-}
 function assertValidOptions(options) {
     const slashes = ['/', '\\'];
     slashes.forEach((s) => {

package/src/generators/component/schema.d.ts

@@ -3,12 +3,22 @@
  */
 export interface Schema {
   name: string;
+  /**
+   * @deprecated Provide the `directory` option instead and use the `as-provided` format. The project will be determined from the directory provided. It will be removed in Nx v18.
+   */
   project: string;
   skipTests?: boolean;
   directory?: string;
   export?: boolean;
+  /**
+   * @deprecated Provide the `directory` option instead and use the `as-provided` format. This option will be removed in Nx v18.
+   */
   pascalCaseFiles?: boolean;
   classComponent?: boolean;
   js?: boolean;
+  /**
+   * @deprecated Provide the `name` in pascal-case and use the `as-provided` format. This option will be removed in Nx v18.
+   */
   flat?: boolean;
+  nameAndDirectoryFormat?: 'as-provided' | 'derived';
 }

package/src/generators/component/schema.json

@@ -23,7 +23,7 @@
       "$default": {
         "$source": "projectName"
       },
-      "x-prompt": "What is the name of the project for this component?"
+      "x-deprecated": "Provide the `directory` option instead and use the `as-provided` format. The project will be determined from the directory provided. It will be removed in Nx v18."
     },
     "name": {
       "type": "string",
@@ -46,13 +46,19 @@
     },
     "directory": {
       "type": "string",
-      "description": "Create the component under this directory (can be nested).",
+      "description": "The directory at which to create the component file. When `--nameAndDirectoryFormat=as-provided`, it will be relative to the current working directory. Otherwise, it will be relative to the project root.",
       "x-priority": "important"
     },
+    "nameAndDirectoryFormat": {
+      "description": "Whether to generate the component in the directory as provided, relative to the current working directory and ignoring the project (`as-provided`) or generate it using the project and directory relative to the workspace root (`derived`).",
+      "type": "string",
+      "enum": ["as-provided", "derived"]
+    },
     "flat": {
       "type": "boolean",
       "description": "Create component at the source root rather than its own directory.",
-      "default": false
+      "default": false,
+      "x-deprecated": "Provide the `directory` option instead and use the `as-provided` format. This option will be removed in Nx v18."
     },
     "export": {
       "type": "boolean",
@@ -65,7 +71,8 @@
       "type": "boolean",
       "description": "Use pascal case component file name (e.g. `App.tsx`).",
       "alias": "P",
-      "default": false
+      "default": false,
+      "x-deprecated": "Provide the `name` in pascal-case and use the `as-provided` format. This option will be removed in Nx v18."
     },
     "classComponent": {
       "type": "boolean",
@@ -74,5 +81,5 @@
       "default": false
     }
   },
-  "required": ["name", "project"]
+  "required": ["name"]
 }

package/src/generators/component-story/component-story.spec.ts

@@ -1,7 +1,7 @@
 import { getProjects, Tree, updateProjectConfiguration } from '@nx/devkit';
 import { createTreeWithEmptyWorkspace } from '@nx/devkit/testing';
 import componentStoryGenerator from './component-story';
-import { Linter } from '@nx/linter';
+import { Linter } from '@nx/eslint';
 
 import { formatFile } from '../../utils/format-file';
 import libraryGenerator from '../library/library';
@@ -75,9 +75,9 @@ describe('react-native:component-story', () => {
         appTree.write(
           'test-ui-lib/src/lib/test-ui-libplain.jsx',
           `import React from 'react';
-  
+
           import './test.scss';
-          
+
           export const Test = () => {
             return (
               <div>
@@ -85,8 +85,8 @@ describe('react-native:component-story', () => {
               </div>
             );
           };
-          
-          export default Test;        
+
+          export default Test;
           `
         );
 
@@ -117,7 +117,7 @@ describe('react-native:component-story', () => {
           `import React from 'react';
 
           import { View, Text } from 'react-native';
-          
+
           export function Test() {
             return (
               <View>
@@ -125,8 +125,8 @@ describe('react-native:component-story', () => {
               </View>
             );
           }
-          
-          export default Test;   
+
+          export default Test;
           `
         );
         await componentStoryGenerator(appTree, {
@@ -178,14 +178,14 @@ describe('react-native:component-story', () => {
           `import React from 'react';
 
           export type ButtonStyle = 'default' | 'primary' | 'warning';
-          
+
           export interface TestProps {
             name: string;
             displayAge: boolean;
             someAction: (e: unknown) => void;
             style: ButtonStyle;
           }
-          
+
           export const Test = (props: TestProps) => {
             return (
               <div>
@@ -194,8 +194,8 @@ describe('react-native:component-story', () => {
               </div>
             );
           };
-          
-          export default Test;        
+
+          export default Test;
           `
         );
 
@@ -337,12 +337,12 @@ describe('react-native:component-story', () => {
           appTree.write(
             cmpPath,
             `import React from 'react';
-            
+
             export interface TestProps {
               name: string;
               displayAge: boolean;
             }
-            
+
             ${config.src}
             `
           );

package/src/generators/library/library.spec.ts

@@ -6,14 +6,14 @@ import {
 } from '@nx/devkit';
 import { createTreeWithEmptyWorkspace } from '@nx/devkit/testing';
 import libraryGenerator from './library';
-import { Linter } from '@nx/linter';
+import { Linter } from '@nx/eslint';
 import { Schema } from './schema';
 
 describe('lib', () => {
   let appTree: Tree;
 
   const defaultSchema: Schema = {
-    name: 'myLib',
+    name: 'my-lib',
     linter: Linter.EsLint,
     skipFormat: false,
     skipTsConfig: false,
@@ -34,7 +34,7 @@ describe('lib', () => {
       expect(projectConfiguration.root).toEqual('my-lib');
       expect(projectConfiguration.targets.build).toBeUndefined();
       expect(projectConfiguration.targets.lint).toEqual({
-        executor: '@nx/linter:eslint',
+        executor: '@nx/eslint:lint',
         outputs: ['{options.outputFile}'],
         options: {
           lintFilePatterns: ['my-lib/**/*.{ts,tsx,js,jsx}'],
@@ -124,7 +124,7 @@ describe('lib', () => {
     it('should update nx.json', async () => {
       await libraryGenerator(appTree, {
         ...defaultSchema,
-        directory: 'myDir',
+        directory: 'my-dir',
         tags: 'one',
       });
 
@@ -135,8 +135,8 @@ describe('lib', () => {
 
       await libraryGenerator(appTree, {
         ...defaultSchema,
-        name: 'myLib2',
-        directory: 'myDir2',
+        name: 'my-lib2',
+        directory: 'my-dir2',
         tags: 'one,two',
       });
 
@@ -150,12 +150,15 @@ describe('lib', () => {
     });
 
     it('should update project.json', async () => {
-      await libraryGenerator(appTree, { ...defaultSchema, directory: 'myDir' });
+      await libraryGenerator(appTree, {
+        ...defaultSchema,
+        directory: 'my-dir',
+      });
       const projectConfiguration = readProjectConfiguration(appTree, 'my-lib');
 
       expect(projectConfiguration.root).toEqual('my-dir');
       expect(projectConfiguration.targets.lint).toEqual({
-        executor: '@nx/linter:eslint',
+        executor: '@nx/eslint:lint',
         outputs: ['{options.outputFile}'],
         options: {
           lintFilePatterns: ['my-dir/**/*.{ts,tsx,js,jsx}'],
@@ -164,7 +167,10 @@ describe('lib', () => {
     });
 
     it('should update root tsconfig.base.json', async () => {
-      await libraryGenerator(appTree, { ...defaultSchema, directory: 'myDir' });
+      await libraryGenerator(appTree, {
+        ...defaultSchema,
+        directory: 'my-dir',
+      });
       const tsconfigJson = readJson(appTree, '/tsconfig.base.json');
       expect(tsconfigJson.compilerOptions.paths['@proj/my-lib']).toEqual([
         'my-dir/src/index.ts',
@@ -177,7 +183,10 @@ describe('lib', () => {
     it('should update root tsconfig.json when no tsconfig.base.json', async () => {
       appTree.rename('tsconfig.base.json', 'tsconfig.json');
 
-      await libraryGenerator(appTree, { ...defaultSchema, directory: 'myDir' });
+      await libraryGenerator(appTree, {
+        ...defaultSchema,
+        directory: 'my-dir',
+      });
 
       const tsconfigJson = readJson(appTree, '/tsconfig.json');
       expect(tsconfigJson.compilerOptions.paths['@proj/my-lib']).toEqual([
@@ -189,7 +198,10 @@ describe('lib', () => {
     });
 
     it('should create a local tsconfig.json', async () => {
-      await libraryGenerator(appTree, { ...defaultSchema, directory: 'myDir' });
+      await libraryGenerator(appTree, {
+        ...defaultSchema,
+        directory: 'my-dir',
+      });
 
       const tsconfigJson = readJson(appTree, 'my-dir/tsconfig.json');
       expect(tsconfigJson.extends).toBe('../tsconfig.base.json');
@@ -206,7 +218,10 @@ describe('lib', () => {
     it('should extend from root tsconfig.json when no tsconfig.base.json', async () => {
       appTree.rename('tsconfig.base.json', 'tsconfig.json');
 
-      await libraryGenerator(appTree, { ...defaultSchema, directory: 'myDir' });
+      await libraryGenerator(appTree, {
+        ...defaultSchema,
+        directory: 'my-dir',
+      });
 
       const tsconfigJson = readJson(appTree, 'my-dir/tsconfig.json');
       expect(tsconfigJson.extends).toBe('../tsconfig.json');
@@ -225,7 +240,7 @@ describe('lib', () => {
       const projectConfiguration = readProjectConfiguration(appTree, 'my-lib');
       expect(projectConfiguration.targets.test).toBeUndefined();
       expect(projectConfiguration.targets.lint).toMatchObject({
-        executor: '@nx/linter:eslint',
+        executor: '@nx/eslint:lint',
         options: {
           lintFilePatterns: ['my-lib/**/*.{ts,tsx,js,jsx}'],
         },
@@ -343,7 +358,7 @@ describe('lib', () => {
       try {
         await libraryGenerator(appTree, {
           ...defaultSchema,
-          directory: 'myDir',
+          directory: 'my-dir',
           publishable: true,
         });
       } catch (e) {
@@ -382,7 +397,7 @@ describe('lib', () => {
       await libraryGenerator(appTree, {
         ...defaultSchema,
         publishable: true,
-        directory: 'myDir',
+        directory: 'my-dir',
         importPath: '@myorg/lib',
       });
       const packageJson = readJson(appTree, 'my-dir/package.json');
@@ -397,7 +412,7 @@ describe('lib', () => {
     it('should fail if the same importPath has already been used', async () => {
       await libraryGenerator(appTree, {
         ...defaultSchema,
-        name: 'myLib1',
+        name: 'my-lib1',
         publishable: true,
         importPath: '@myorg/lib',
       });
@@ -405,7 +420,7 @@ describe('lib', () => {
       try {
         await libraryGenerator(appTree, {
           ...defaultSchema,
-          name: 'myLib2',
+          name: 'my-lib2',
           publishable: true,
           importPath: '@myorg/lib',
         });

package/src/generators/library/schema.d.ts

@@ -1,5 +1,5 @@
 import type { ProjectNameAndRootFormat } from '@nx/devkit/src/generators/project-name-and-root-utils';
-import type { Linter } from '@nx/linter';
+import type { Linter } from '@nx/eslint';
 
 /**
  * Same as the @nx/react library schema, except it removes keys: style, component, routing, appProject

package/src/generators/stories/stories-app.spec.ts

@@ -2,7 +2,7 @@ import { Tree } from '@nx/devkit';
 import storiesGenerator from './stories';
 import { createTreeWithEmptyWorkspace } from '@nx/devkit/testing';
 import applicationGenerator from '../application/application';
-import { Linter } from '@nx/linter';
+import { Linter } from '@nx/eslint';
 import { reactNativeComponentGenerator } from '../component/component';
 
 describe('react:stories for applications', () => {

package/src/generators/stories/stories-lib.spec.ts

@@ -2,7 +2,7 @@ import { Tree } from '@nx/devkit';
 import storiesGenerator from './stories';
 import { createTreeWithEmptyWorkspace } from '@nx/devkit/testing';
 import applicationGenerator from '../application/application';
-import { Linter } from '@nx/linter';
+import { Linter } from '@nx/eslint';
 import libraryGenerator from '../library/library';
 import reactNativeComponentGenerator from '../component/component';
 

package/src/generators/storybook-configuration/configuration.spec.ts

@@ -1,6 +1,6 @@
 import { Tree } from '@nx/devkit';
 import { createTreeWithEmptyWorkspace } from '@nx/devkit/testing';
-import { Linter } from '@nx/linter';
+import { Linter } from '@nx/eslint';
 import { logger } from '@nx/devkit';
 
 import libraryGenerator from '../library/library';

package/src/generators/storybook-configuration/schema.d.ts

@@ -1,4 +1,4 @@
-import { Linter } from '@nx/linter';
+import { Linter } from '@nx/eslint';
 
 export interface StorybookConfigureSchema {
   name: string;

package/src/generators/upgrade-native/schema.d.ts

@@ -1,4 +1,4 @@
-import { Linter } from '@nx/linter';
+import { Linter } from '@nx/eslint';
 
 export interface UpgradeNativeConfigureSchema {
   name: string;

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

@@ -1,4 +1,4 @@
-import { Linter } from '@nx/linter';
+import { Linter } from '@nx/eslint';
 import { GeneratorCallback, Tree } from '@nx/devkit';
 interface NormalizedSchema {
     linter?: Linter;

package/src/utils/add-linting.js

@@ -1,16 +1,16 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.addLinting = void 0;
-const linter_1 = require("@nx/linter");
+const eslint_1 = require("@nx/eslint");
 const devkit_1 = require("@nx/devkit");
 const lint_1 = require("@nx/react/src/utils/lint");
-const eslint_file_1 = require("@nx/linter/src/generators/utils/eslint-file");
+const eslint_file_1 = require("@nx/eslint/src/generators/utils/eslint-file");
 async function addLinting(host, options) {
-    if (options.linter === linter_1.Linter.None) {
+    if (options.linter === eslint_1.Linter.None) {
         return () => { };
     }
     const tasks = [];
-    const lintTask = await (0, linter_1.lintProjectGenerator)(host, {
+    const lintTask = await (0, eslint_1.lintProjectGenerator)(host, {
         linter: options.linter,
         project: options.projectName,
         tsConfigPaths: options.tsConfigPaths,

package/src/utils/add-linting.spec.ts

@@ -1,6 +1,6 @@
 import { readProjectConfiguration, Tree } from '@nx/devkit';
 import { createTreeWithEmptyWorkspace } from '@nx/devkit/testing';
-import { Linter } from '@nx/linter';
+import { Linter } from '@nx/eslint';
 import { libraryGenerator } from '@nx/js';
 import { addLinting } from './add-linting';
 
@@ -25,7 +25,7 @@ describe('Add Linting', () => {
     const project = readProjectConfiguration(tree, 'my-lib');
 
     expect(project.targets.lint).toBeDefined();
-    expect(project.targets.lint.executor).toEqual('@nx/linter:eslint');
+    expect(project.targets.lint.executor).toEqual('@nx/eslint:lint');
   });
 
   it('should not add lint target when "none" is passed', async () => {

package/src/utils/testing-generators.js

@@ -3,10 +3,10 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.createLib = exports.createApp = void 0;
 const devkit_1 = require("@nx/devkit");
 const application_1 = require("../generators/application/application");
-const linter_1 = require("@nx/linter");
+const eslint_1 = require("@nx/eslint");
 async function createApp(tree, appName) {
     await (0, application_1.default)(tree, {
-        linter: linter_1.Linter.EsLint,
+        linter: eslint_1.Linter.EsLint,
         skipFormat: true,
         style: 'css',
         unitTestRunner: 'none',