@nx/react 16.10.0 → 17.0.0-beta.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nx/react",
-  "version": "16.10.0",
+  "version": "17.0.0-beta.2",
   "private": false,
   "description": "The React plugin for Nx contains executors and generators for managing React applications and libraries within an Nx workspace. It provides:\n\n\n- Integration with libraries such as Jest, Cypress, and Storybook.\n\n- Generators for applications, libraries, components, hooks, and more.\n\n- Library build support for publishing packages to npm or other registries.\n\n- Utilities for automatic workspace refactoring.",
   "repository": {
@@ -37,11 +37,11 @@
     "file-loader": "^6.2.0",
     "minimatch": "3.0.5",
     "tslib": "^2.3.0",
-    "@nx/devkit": "16.10.0",
-    "@nx/js": "16.10.0",
-    "@nx/linter": "16.10.0",
-    "@nx/web": "16.10.0",
-    "@nrwl/react": "16.10.0"
+    "@nx/devkit": "17.0.0-beta.2",
+    "@nx/js": "17.0.0-beta.2",
+    "@nx/linter": "17.0.0-beta.2",
+    "@nx/web": "17.0.0-beta.2",
+    "@nrwl/react": "17.0.0-beta.2"
   },
   "publishConfig": {
     "access": "public"

package/src/executors/module-federation-dev-server/module-federation-dev-server.impl.js

@@ -24,7 +24,7 @@ function getModuleFederationConfig(tsconfigPath, workspaceRoot, projectRoot) {
     // create a no-op so this can be called with issue
     let cleanupTranspiler = () => { };
     if ((0, fs_1.existsSync)(moduleFederationConfigPathTS)) {
-        cleanupTranspiler = (0, internal_1.registerTsProject)(moduleFederationConfigPathTS, tsconfigPath);
+        cleanupTranspiler = (0, internal_1.registerTsProject)((0, path_1.join)(workspaceRoot, tsconfigPath));
         moduleFederationConfigPath = moduleFederationConfigPathTS;
     }
     try {

package/src/generators/application/files/style-styled-jsx/src/app/__fileName__.tsx__tmpl__

@@ -14,6 +14,14 @@ export function App() {
   return (
     <div>
       <style jsx>{`/** your style here **/`}</style>
+        <% if (!minimal) { %>
+        <NxWelcome title="<%= projectName %>"/>
+        <% } else { %>
+          <h1>
+            <span> Hello there, </span>
+            Welcome <%= projectName %> 👋
+          </h1>
+        <% } %>
     </div>
   );
 

package/src/generators/federate-module/federate-module.d.ts

@@ -0,0 +1,5 @@
+import { GeneratorCallback, Tree } from '@nx/devkit';
+import { Schema } from './schema';
+export declare function federateModuleGenerator(tree: Tree, schema: Schema): Promise<GeneratorCallback>;
+export default federateModuleGenerator;
+export declare const federateModuleSchematic: (generatorOptions: Schema) => (tree: any, context: any) => Promise<any>;

package/src/generators/federate-module/federate-module.js

@@ -0,0 +1,58 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.federateModuleSchematic = exports.federateModuleGenerator = void 0;
+const devkit_1 = require("@nx/devkit");
+const remote_1 = require("../remote/remote");
+const utils_1 = require("./lib/utils");
+const project_name_and_root_utils_1 = require("@nx/devkit/src/generators/project-name-and-root-utils");
+const js_1 = require("@nx/js");
+async function federateModuleGenerator(tree, schema) {
+    const tasks = [];
+    // Check remote exists
+    const remote = (0, utils_1.checkRemoteExists)(tree, schema.remote);
+    const { projectName, projectRoot: remoteRoot } = await (0, project_name_and_root_utils_1.determineProjectNameAndRootOptions)(tree, {
+        name: schema.remote,
+        projectType: 'application',
+        projectNameAndRootFormat: schema.projectNameAndRootFormat,
+        callingGenerator: '@nx/react:federate-module',
+    });
+    if (!remote) {
+        // create remote
+        const remoteGenerator = await (0, remote_1.remoteGeneratorInternal)(tree, {
+            name: schema.remote,
+            e2eTestRunner: schema.e2eTestRunner,
+            skipFormat: schema.skipFormat,
+            linter: schema.linter,
+            style: schema.style,
+            unitTestRunner: schema.unitTestRunner,
+            host: schema.host,
+            projectNameAndRootFormat: schema.projectNameAndRootFormat ?? 'derived',
+        });
+        tasks.push(remoteGenerator);
+    }
+    const projectRoot = remote ? remote.root : remoteRoot;
+    const remoteName = remote ? remote.name : projectName;
+    // add path to exposes property
+    (0, utils_1.addPathToExposes)(tree, projectRoot, schema.name, schema.path);
+    // Add new path to tsconfig
+    const rootJSON = (0, devkit_1.readJson)(tree, (0, js_1.getRootTsConfigPathInTree)(tree));
+    if (!rootJSON?.compilerOptions?.paths[`${remoteName}/${schema.name}`]) {
+        (0, js_1.addTsConfigPath)(tree, `${remoteName}/${schema.name}`, [schema.path]);
+    }
+    if (!schema.skipFormat) {
+        await (0, devkit_1.formatFiles)(tree);
+    }
+    devkit_1.logger.info(`✅️ Updated module federation config.
+    Now you can use the module from your host app like this:
+
+    Static import:
+    import { MyComponent } from '${schema.name}/${remoteName}';
+    
+    Dynamic import:
+    import('${schema.name}/${remoteName}').then((m) => m.${remoteName});
+  `);
+    return (0, devkit_1.runTasksInSerial)(...tasks);
+}
+exports.federateModuleGenerator = federateModuleGenerator;
+exports.default = federateModuleGenerator;
+exports.federateModuleSchematic = (0, devkit_1.convertNxGenerator)(federateModuleGenerator);

package/src/generators/federate-module/lib/utils.d.ts

@@ -0,0 +1,23 @@
+import { Tree } from '@nx/devkit';
+import type { SourceFile, ObjectLiteralExpression, PropertyAssignment } from 'typescript';
+/**
+ * Adds a Module Federation path to the exposes property of the module federation config
+ * The assumption here is made the we will only update a TypeScript Module Federation file namely 'module-federation.config.js'
+ * @param tree Tree for the workspace
+ * @param projectPath Project path relative to the workspace
+ * @param moduleName The name of the module to expose
+ * @param modulePath The path to the module to expose (e.g. './src/my-lib/my-lib.ts')
+ */
+export declare function addPathToExposes(tree: Tree, projectPath: string, moduleName: string, modulePath: string): void;
+/**
+ * @param tree The workspace tree
+ * @param remoteName The name of the remote to check
+ * @returns Remote ProjectConfig if it exists, false otherwise
+ */
+export declare function checkRemoteExists(tree: Tree, remoteName: string): false | import("@nx/devkit").ProjectConfiguration;
+export declare function getRemote(tree: Tree, remoteName: string): import("@nx/devkit").ProjectConfiguration;
+export declare function findExposes(sourceFile: SourceFile): ObjectLiteralExpression;
+export declare function createObjectEntry(moduleName: string, modulePath: string): PropertyAssignment;
+export declare function updateExposesPropertyinAST(source: SourceFile, exposesObject: ObjectLiteralExpression, newEntry: PropertyAssignment): SourceFile;
+export declare function writeToConfig(tree: Tree, filename: string, source: SourceFile, updatedSourceFile: SourceFile): void;
+export declare function updateExposesProperty(tree: Tree, filename: string, moduleName: string, modulePath: string): void;

package/src/generators/federate-module/lib/utils.js

@@ -0,0 +1,97 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.updateExposesProperty = exports.writeToConfig = exports.updateExposesPropertyinAST = exports.createObjectEntry = exports.findExposes = exports.getRemote = exports.checkRemoteExists = exports.addPathToExposes = void 0;
+const devkit_1 = require("@nx/devkit");
+const ensure_typescript_1 = require("@nx/js/src/utils/typescript/ensure-typescript");
+let tsModule;
+if (!tsModule) {
+    tsModule = (0, ensure_typescript_1.ensureTypescript)();
+}
+/**
+ * Adds a Module Federation path to the exposes property of the module federation config
+ * The assumption here is made the we will only update a TypeScript Module Federation file namely 'module-federation.config.js'
+ * @param tree Tree for the workspace
+ * @param projectPath Project path relative to the workspace
+ * @param moduleName The name of the module to expose
+ * @param modulePath The path to the module to expose (e.g. './src/my-lib/my-lib.ts')
+ */
+function addPathToExposes(tree, projectPath, moduleName, modulePath) {
+    const moduleFederationConfigPath = (0, devkit_1.joinPathFragments)(projectPath, 'module-federation.config.js');
+    updateExposesProperty(tree, moduleFederationConfigPath, moduleName, modulePath);
+}
+exports.addPathToExposes = addPathToExposes;
+/**
+ * @param tree The workspace tree
+ * @param remoteName The name of the remote to check
+ * @returns Remote ProjectConfig if it exists, false otherwise
+ */
+function checkRemoteExists(tree, remoteName) {
+    const remote = getRemote(tree, remoteName);
+    if (!remote)
+        return false;
+    const hasModuleFederationConfig = tree.exists((0, devkit_1.joinPathFragments)(remote.root, 'module-federation.config.js'));
+    return hasModuleFederationConfig ? remote : false;
+}
+exports.checkRemoteExists = checkRemoteExists;
+function getRemote(tree, remoteName) {
+    const projects = (0, devkit_1.getProjects)(tree);
+    const remote = projects.get(remoteName);
+    return remote;
+}
+exports.getRemote = getRemote;
+// Check if the exposes property exists in the AST
+function findExposes(sourceFile) {
+    let exposesObject = null;
+    const visit = (node) => {
+        if (tsModule.isPropertyAssignment(node) &&
+            tsModule.isIdentifier(node.name) &&
+            node.name.text === 'exposes' &&
+            tsModule.isObjectLiteralExpression(node.initializer)) {
+            exposesObject = node.initializer;
+        }
+        else {
+            tsModule.forEachChild(node, visit);
+        }
+    };
+    tsModule.forEachChild(sourceFile, visit);
+    return exposesObject;
+}
+exports.findExposes = findExposes;
+// Create a new property assignment
+function createObjectEntry(moduleName, modulePath) {
+    return tsModule.factory.createPropertyAssignment(tsModule.factory.createStringLiteral(`./${moduleName}`, true), tsModule.factory.createStringLiteral(modulePath, true));
+}
+exports.createObjectEntry = createObjectEntry;
+// Update the exposes property in the AST
+function updateExposesPropertyinAST(source, exposesObject, newEntry) {
+    const updatedExposes = tsModule.factory.updateObjectLiteralExpression(exposesObject, [...exposesObject.properties, newEntry]);
+    const transform = (context) => {
+        const visit = (node) => {
+            // Comparing nodes indirectly to ensure type compatibility. You must ensure that the nodes are identical.
+            return tsModule.isObjectLiteralExpression(node) && node === exposesObject
+                ? updatedExposes
+                : tsModule.visitEachChild(node, visit, context);
+        };
+        return (node) => tsModule.visitNode(node, visit);
+    };
+    return tsModule.transform(source, [transform]).transformed[0];
+}
+exports.updateExposesPropertyinAST = updateExposesPropertyinAST;
+// Write the updated AST to the file (module-federation.config.js)
+function writeToConfig(tree, filename, source, updatedSourceFile) {
+    const printer = tsModule.createPrinter();
+    const update = printer.printNode(tsModule.EmitHint.Unspecified, updatedSourceFile, source);
+    tree.write(filename, update);
+}
+exports.writeToConfig = writeToConfig;
+function updateExposesProperty(tree, filename, moduleName, modulePath) {
+    const fileContent = tree.read(filename).toString();
+    const source = tsModule.createSourceFile(filename, fileContent, tsModule.ScriptTarget.ES2015, true);
+    const exposesObject = findExposes(source);
+    if (!exposesObject)
+        return;
+    const newEntry = createObjectEntry(moduleName, modulePath);
+    const updatedSourceFile = updateExposesPropertyinAST(source, exposesObject, newEntry);
+    writeToConfig(tree, filename, source, updatedSourceFile);
+}
+exports.updateExposesProperty = updateExposesProperty;

package/src/generators/federate-module/schema.d.ts

@@ -0,0 +1,12 @@
+export interface Schema {
+  name: string;
+  path: string;
+  remote: string;
+  projectNameAndRootFormat?: ProjectNameAndRootFormat;
+  e2eTestRunner?: 'cypress' | 'none';
+  host?: string;
+  linter?: Linter;
+  skipFormat?: boolean;
+  style?: SupportedStyles;
+  unitTestRunner?: 'jest' | 'vitest' | 'none';
+}

package/src/generators/federate-module/schema.json

@@ -0,0 +1,116 @@
+{
+  "$schema": "http://json-schema.org/schema",
+  "cli": "nx",
+  "$id": "NxReactFederateModule",
+  "title": "Federate Module",
+  "description": "Create a federated module, which can be loaded by a remote host.",
+  "examples": [
+    {
+      "command": "nx g federate-module MyModule --path=./src/component/my-cmp.ts --remote=my-remote-app",
+      "description": "Create a federated module from my-remote-app, that exposes my-cmp from ./src/component/my-cmp.ts as MyModule."
+    }
+  ],
+  "type": "object",
+  "properties": {
+    "name": {
+      "description": "The name of the module.",
+      "type": "string",
+      "$default": {
+        "$source": "argv",
+        "index": 0
+      },
+      "x-prompt": "What name would you like to use for the module?",
+      "pattern": "^[a-zA-Z][^:]*$",
+      "x-priority": "important"
+    },
+    "path": {
+      "type": "string",
+      "description": "The path to locate the federated module.",
+      "x-prompt": "What is the path to the module to be federated?"
+    },
+    "remote": {
+      "type": "string",
+      "description": "The name of the remote.",
+      "x-prompt": "What is/should the remote be named?"
+    },
+    "projectNameAndRootFormat": {
+      "description": "Whether to generate the project name and root directory as provided (`as-provided`) or generate them composing their values and taking the configured layout into account (`derived`).",
+      "type": "string",
+      "enum": ["as-provided", "derived"]
+    },
+    "style": {
+      "description": "The file extension to be used for style files.",
+      "type": "string",
+      "default": "css",
+      "alias": "s",
+      "x-prompt": {
+        "message": "Which stylesheet format would you like to use?",
+        "type": "list",
+        "items": [
+          {
+            "value": "css",
+            "label": "CSS"
+          },
+          {
+            "value": "scss",
+            "label": "SASS(.scss)       [ http://sass-lang.com                     ]"
+          },
+          {
+            "value": "less",
+            "label": "LESS              [ http://lesscss.org                       ]"
+          },
+          {
+            "value": "styled-components",
+            "label": "styled-components [ https://styled-components.com            ]"
+          },
+          {
+            "value": "@emotion/styled",
+            "label": "emotion           [ https://emotion.sh                       ]"
+          },
+          {
+            "value": "styled-jsx",
+            "label": "styled-jsx        [ https://www.npmjs.com/package/styled-jsx ]"
+          },
+          {
+            "value": "styl",
+            "label": "DEPRECATD: Stylus(.styl) [ http://stylus-lang.com            ]"
+          },
+          {
+            "value": "none",
+            "label": "None"
+          }
+        ]
+      }
+    },
+    "linter": {
+      "description": "The tool to use for running lint checks.",
+      "type": "string",
+      "enum": ["eslint"],
+      "default": "eslint"
+    },
+    "skipFormat": {
+      "description": "Skip formatting files.",
+      "type": "boolean",
+      "default": false,
+      "x-priority": "internal"
+    },
+    "unitTestRunner": {
+      "type": "string",
+      "enum": ["jest", "none"],
+      "description": "Test runner to use for unit tests.",
+      "default": "jest"
+    },
+    "e2eTestRunner": {
+      "type": "string",
+      "enum": ["cypress", "none"],
+      "description": "Test runner to use for end to end (e2e) tests.",
+      "default": "cypress"
+    },
+    "host": {
+      "type": "string",
+      "description": "The host / shell application for this remote."
+    }
+  },
+  "required": ["name", "path", "remote"],
+  "additionalProperties": false
+}

package/src/generators/remote/remote.js

@@ -43,7 +43,7 @@ async function remoteGeneratorInternal(host, schema) {
     const tasks = [];
     const options = {
         ...(await (0, normalize_options_1.normalizeOptions)(host, schema, '@nx/react:remote')),
-        typescriptConfiguration: schema.typescriptConfiguration ?? true,
+        typescriptConfiguration: schema.typescriptConfiguration ?? false,
     };
     const initAppTask = await (0, application_1.default)(host, {
         ...options,

package/src/generators/setup-ssr/setup-ssr.js

@@ -124,12 +124,15 @@ async function setupSsrGenerator(tree, options) {
     (0, devkit_1.updateProjectConfiguration)(tree, options.project, projectConfig);
     const nxJson = (0, devkit_1.readNxJson)(tree);
     if (nxJson.tasksRunnerOptions?.default &&
-        !nxJson.tasksRunnerOptions.default.options.cacheableOperations.includes('server')) {
+        !nxJson.tasksRunnerOptions?.default.options.cacheableOperations.includes('server')) {
         nxJson.tasksRunnerOptions.default.options.cacheableOperations = [
             ...nxJson.tasksRunnerOptions.default.options.cacheableOperations,
             'server',
         ];
     }
+    nxJson.targetDefaults ??= {};
+    nxJson.targetDefaults['server'] ??= {};
+    nxJson.targetDefaults.server.cache = true;
     (0, devkit_1.generateFiles)(tree, (0, path_1.join)(__dirname, 'files'), projectRoot, {
         tmpl: '',
         extraInclude: options.extraInclude?.length > 0

package/src/generators/storybook-configuration/configuration.js

@@ -5,7 +5,7 @@ const stories_1 = require("../stories/stories");
 const devkit_1 = require("@nx/devkit");
 const versions_1 = require("../../utils/versions");
 async function generateStories(host, schema) {
-    // TODO(v18): remove Cypress
+    // TODO(katerina): Nx 18 -> remove Cypress
     (0, devkit_1.ensurePackage)('@nx/cypress', versions_1.nxVersion);
     const { getE2eProjectName } = await Promise.resolve().then(() => require('@nx/cypress/src/utils/project-name'));
     const projectConfig = (0, devkit_1.readProjectConfiguration)(host, schema.name);

package/src/migrations/update-16-7-0-add-typings/update-16-7-0-add-typings.js

@@ -8,6 +8,11 @@ async function addTypings(tree) {
         '@nx/vite:build',
         '@nx/rspack:rspack',
     ];
+    const serveExecutors = [
+        '@nx/webpack:dev-server',
+        '@nx/vite:dev-server',
+        '@nx/rspack:dev-server',
+    ];
     const relatedTsConfigs = [
         'tsconfig.app.json',
         'tsconfig.lib.json',
@@ -18,24 +23,34 @@ async function addTypings(tree) {
         '@nx/react/typings/image.d.ts',
     ];
     for (const [, config] of projects) {
-        if (buildExecutors.includes(config?.targets?.build?.executor)) {
-            const rootPath = config.root;
-            relatedTsConfigs.forEach((tsConfig) => {
-                const tsConfigPath = (0, devkit_1.joinPathFragments)(rootPath, tsConfig);
-                if (tree.exists(tsConfigPath)) {
-                    (0, devkit_1.updateJson)(tree, tsConfigPath, (json) => {
-                        const compilerOptions = json.compilerOptions || {};
-                        compilerOptions.types = [
-                            ...new Set([...(compilerOptions.types || []), ...typesToAdd]),
-                        ];
-                        if (json.files?.length > 0) {
-                            json.files = json.files.filter((file) => !['cssmodule.d.ts', 'image.d.ts'].includes(file));
-                        }
-                        return { ...json, compilerOptions };
-                    });
-                }
-            });
+        if (!buildExecutors.includes(config?.targets?.build?.executor)) {
+            continue;
+        }
+        if (config?.targets?.serve?.executor &&
+            !serveExecutors.includes(config?.targets?.serve?.executor)) {
+            continue;
+        }
+        const rootPath = config.root;
+        const projectTsConfigPath = (0, devkit_1.joinPathFragments)(rootPath, 'tsconfig.json');
+        const projectTsConfig = (0, devkit_1.readJson)(tree, projectTsConfigPath);
+        if (projectTsConfig.compilerOptions?.jsx !== 'react-jsx') {
+            continue;
         }
+        relatedTsConfigs.forEach((tsConfig) => {
+            const tsConfigPath = (0, devkit_1.joinPathFragments)(rootPath, tsConfig);
+            if (tree.exists(tsConfigPath)) {
+                (0, devkit_1.updateJson)(tree, tsConfigPath, (json) => {
+                    const compilerOptions = json.compilerOptions || {};
+                    compilerOptions.types = [
+                        ...new Set([...(compilerOptions.types || []), ...typesToAdd]),
+                    ];
+                    if (json.files?.length > 0) {
+                        json.files = json.files.filter((file) => !['cssmodule.d.ts', 'image.d.ts'].includes(file));
+                    }
+                    return { ...json, compilerOptions };
+                });
+            }
+        });
     }
     await (0, devkit_1.formatFiles)(tree);
 }

package/src/module-federation/with-module-federation.js

@@ -14,14 +14,13 @@ async function withModuleFederation(options) {
         config.output.publicPath = 'auto';
         if (options.library?.type === 'var') {
             config.output.scriptType = 'text/javascript';
-            config.experiments.outputModule = false;
         }
         config.optimization = {
             runtimeChunk: false,
         };
         config.experiments = {
             ...config.experiments,
-            outputModule: true,
+            outputModule: !(options.library?.type === 'var'),
         };
         config.plugins.push(new ModuleFederationPlugin({
             name: options.name,

package/src/migrations/update-12-0-0/remove-react-redux-types-package.d.ts

@@ -1,3 +0,0 @@
-import { Tree } from '@nx/devkit';
-export declare function removeReactReduxTypesFromPackageJson(host: Tree): Promise<import("@nx/devkit").GeneratorCallback>;
-export default removeReactReduxTypesFromPackageJson;

package/src/migrations/update-12-0-0/remove-react-redux-types-package.js

@@ -1,9 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.removeReactReduxTypesFromPackageJson = void 0;
-const devkit_1 = require("@nx/devkit");
-async function removeReactReduxTypesFromPackageJson(host) {
-    return (0, devkit_1.removeDependenciesFromPackageJson)(host, ['@types/react-redux'], ['@types/react-redux']);
-}
-exports.removeReactReduxTypesFromPackageJson = removeReactReduxTypesFromPackageJson;
-exports.default = removeReactReduxTypesFromPackageJson;

package/src/migrations/update-12-0-0/update-emotion-setup.d.ts

@@ -1,3 +0,0 @@
-import { Tree } from '@nx/devkit';
-export declare function updateEmotionSetup(host: Tree): Promise<void>;
-export default updateEmotionSetup;

package/src/migrations/update-12-0-0/update-emotion-setup.js

@@ -1,61 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.updateEmotionSetup = void 0;
-const devkit_1 = require("@nx/devkit");
-async function updateEmotionSetup(host) {
-    const projects = (0, devkit_1.getProjects)(host);
-    projects.forEach((p) => {
-        const babelrcPath = `${p.root}/.babelrc`;
-        const oldPreset = '@emotion/babel-preset-css-prop';
-        const newPlugin = '@emotion/babel-plugin';
-        if (host.exists(babelrcPath)) {
-            (0, devkit_1.updateJson)(host, babelrcPath, (json) => {
-                if (!json.presets)
-                    return json;
-                let emotionPresetIdx = -1;
-                let emotionOptions = null;
-                for (const [idx, preset] of json.presets.entries()) {
-                    if (Array.isArray(preset)) {
-                        if (!preset[0].includes(oldPreset))
-                            continue;
-                        emotionOptions = preset[1];
-                        emotionPresetIdx = idx;
-                        break;
-                    }
-                    else {
-                        if (!preset.includes(oldPreset))
-                            continue;
-                        emotionPresetIdx = idx;
-                        break;
-                    }
-                }
-                if (emotionPresetIdx !== -1) {
-                    // Remove preset
-                    json.presets.splice(emotionPresetIdx, 1);
-                    // Add new plugin
-                    json.plugins ??= [];
-                    json.plugins.push(emotionOptions ? [newPlugin, emotionOptions] : newPlugin);
-                    return json;
-                }
-                else {
-                    return json;
-                }
-            });
-        }
-    });
-    (0, devkit_1.updateJson)(host, 'package.json', (json) => {
-        if (json.devDependencies?.['@emotion/babel-preset-css-prop']) {
-            delete json.devDependencies['@emotion/babel-preset-css-prop'];
-            json.devDependencies['@emotion/babel-plugin'] = '11.2.0';
-        }
-        // Just in case someone moved it to `dependencies`
-        else if (json.dependencies?.['@emotion/babel-preset-css-prop']) {
-            delete json.dependencies['@emotion/babel-preset-css-prop'];
-            json.dependencies['@emotion/babel-plugin'] = '11.2.0';
-        }
-        return json;
-    });
-    await (0, devkit_1.formatFiles)(host);
-}
-exports.updateEmotionSetup = updateEmotionSetup;
-exports.default = updateEmotionSetup;

package/src/migrations/update-12-0-0/use-react-jsx-in-tsconfig.d.ts

@@ -1,3 +0,0 @@
-import { Tree } from '@nx/devkit';
-export declare function useReactJsxInTsconfig(host: Tree): Promise<void>;
-export default useReactJsxInTsconfig;

package/src/migrations/update-12-0-0/use-react-jsx-in-tsconfig.js

@@ -1,22 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useReactJsxInTsconfig = void 0;
-const devkit_1 = require("@nx/devkit");
-async function useReactJsxInTsconfig(host) {
-    const projects = (0, devkit_1.getProjects)(host);
-    projects.forEach((p) => {
-        const tsConfigPath = `${p.root}/tsconfig.json`;
-        if (host.exists(tsConfigPath)) {
-            (0, devkit_1.updateJson)(host, tsConfigPath, (json) => {
-                if (json.compilerOptions?.jsx === 'react') {
-                    // JSX is handled by babel
-                    json.compilerOptions.jsx = 'react-jsx';
-                }
-                return json;
-            });
-        }
-    });
-    await (0, devkit_1.formatFiles)(host);
-}
-exports.useReactJsxInTsconfig = useReactJsxInTsconfig;
-exports.default = useReactJsxInTsconfig;

package/src/migrations/update-12-8-0/update-12-8-0.d.ts

@@ -1,3 +0,0 @@
-import { Tree } from '@nx/devkit';
-export declare function removeReactReduxTypesFromPackageJson(host: Tree): Promise<import("@nx/devkit").GeneratorCallback>;
-export default removeReactReduxTypesFromPackageJson;

package/src/migrations/update-12-8-0/update-12-8-0.js

@@ -1,11 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.removeReactReduxTypesFromPackageJson = void 0;
-const devkit_1 = require("@nx/devkit");
-async function removeReactReduxTypesFromPackageJson(host) {
-    return (0, devkit_1.addDependenciesToPackageJson)(host, {}, {
-        '@testing-library/react-hooks': '^7.0.1',
-    });
-}
-exports.removeReactReduxTypesFromPackageJson = removeReactReduxTypesFromPackageJson;
-exports.default = removeReactReduxTypesFromPackageJson;

package/src/migrations/update-13-0-0/migrate-storybook-to-webpack-5.d.ts

@@ -1,3 +0,0 @@
-import { Tree } from '@nx/devkit';
-export declare function migrateStorybookToWebPack5(tree: Tree): Promise<void>;
-export default migrateStorybookToWebPack5;