@nrwl/react 13.10.0-rc.0 → 13.10.0

package/src/generators/mfe-host/mfe-host.js

@@ -0,0 +1,46 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.mfeHostGenerator = void 0;
+const tslib_1 = require("tslib");
+const devkit_1 = require("@nrwl/devkit");
+const application_1 = require("../application/application");
+const normalize_options_1 = require("../application/lib/normalize-options");
+const mfe_remote_1 = require("../mfe-remote/mfe-remote");
+const update_mfe_project_1 = require("../../rules/update-mfe-project");
+const add_mfe_files_1 = require("./lib/add-mfe-files");
+const update_mfe_e2e_project_1 = require("./lib/update-mfe-e2e-project");
+function mfeHostGenerator(host, schema) {
+    return tslib_1.__awaiter(this, void 0, void 0, function* () {
+        const options = (0, normalize_options_1.normalizeOptions)(host, schema);
+        const initTask = yield (0, application_1.default)(host, Object.assign(Object.assign({}, options), { 
+            // The target use-case for MFE is loading remotes as child routes, thus always enable routing.
+            routing: true }));
+        const remotesWithPorts = [];
+        if (schema.remotes) {
+            let remotePort = options.devServerPort + 1;
+            for (const remote of schema.remotes) {
+                remotesWithPorts.push({ name: remote, port: remotePort });
+                yield (0, mfe_remote_1.mfeRemoteGenerator)(host, {
+                    name: remote,
+                    style: options.style,
+                    skipFormat: options.skipFormat,
+                    unitTestRunner: options.unitTestRunner,
+                    e2eTestRunner: options.e2eTestRunner,
+                    linter: options.linter,
+                    devServerPort: remotePort,
+                });
+                remotePort++;
+            }
+        }
+        (0, add_mfe_files_1.addMfeFiles)(host, options, remotesWithPorts);
+        (0, update_mfe_project_1.updateMfeProject)(host, options);
+        (0, update_mfe_e2e_project_1.updateMfeE2eProject)(host, options);
+        if (!options.skipFormat) {
+            yield (0, devkit_1.formatFiles)(host);
+        }
+        return initTask;
+    });
+}
+exports.mfeHostGenerator = mfeHostGenerator;
+exports.default = mfeHostGenerator;
+//# sourceMappingURL=mfe-host.js.map

package/src/generators/mfe-host/mfe-host.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mfe-host.js","sourceRoot":"","sources":["../../../../../../packages/react/src/generators/mfe-host/mfe-host.ts"],"names":[],"mappings":";;;;AAAA,yCAAiD;AAEjD,4DAA8D;AAC9D,4EAAwE;AACxE,yDAA8D;AAC9D,uEAAkE;AAClE,uDAAkD;AAClD,yEAAmE;AAGnE,SAAsB,gBAAgB,CAAC,IAAU,EAAE,MAAc;;QAC/D,MAAM,OAAO,GAAG,IAAA,oCAAgB,EAAC,IAAI,EAAE,MAAM,CAAC,CAAC;QAE/C,MAAM,QAAQ,GAAG,MAAM,IAAA,qBAAoB,EAAC,IAAI,kCAC3C,OAAO;YACV,8FAA8F;YAC9F,OAAO,EAAE,IAAI,IACb,CAAC;QAEH,MAAM,gBAAgB,GAAqC,EAAE,CAAC;QAE9D,IAAI,MAAM,CAAC,OAAO,EAAE;YAClB,IAAI,UAAU,GAAG,OAAO,CAAC,aAAa,GAAG,CAAC,CAAC;YAC3C,KAAK,MAAM,MAAM,IAAI,MAAM,CAAC,OAAO,EAAE;gBACnC,gBAAgB,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC,CAAC;gBAC1D,MAAM,IAAA,+BAAkB,EAAC,IAAI,EAAE;oBAC7B,IAAI,EAAE,MAAM;oBACZ,KAAK,EAAE,OAAO,CAAC,KAAK;oBACpB,UAAU,EAAE,OAAO,CAAC,UAAU;oBAC9B,cAAc,EAAE,OAAO,CAAC,cAAc;oBACtC,aAAa,EAAE,OAAO,CAAC,aAAa;oBACpC,MAAM,EAAE,OAAO,CAAC,MAAM;oBACtB,aAAa,EAAE,UAAU;iBAC1B,CAAC,CAAC;gBACH,UAAU,EAAE,CAAC;aACd;SACF;QAED,IAAA,2BAAW,EAAC,IAAI,EAAE,OAAO,EAAE,gBAAgB,CAAC,CAAC;QAC7C,IAAA,qCAAgB,EAAC,IAAI,EAAE,OAAO,CAAC,CAAC;QAChC,IAAA,4CAAmB,EAAC,IAAI,EAAE,OAAO,CAAC,CAAC;QAEnC,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE;YACvB,MAAM,IAAA,oBAAW,EAAC,IAAI,CAAC,CAAC;SACzB;QAED,OAAO,QAAQ,CAAC;IAClB,CAAC;CAAA;AArCD,4CAqCC;AAED,kBAAe,gBAAgB,CAAC"}

package/src/generators/mfe-host/schema.d.ts

@@ -0,0 +1,28 @@
+import { Linter } from '@nrwl/linter';
+import { SupportedStyles } from '../../../typings';
+
+export interface Schema {
+  name: string;
+  style: SupportedStyles;
+  skipFormat: boolean;
+  directory?: string;
+  tags?: string;
+  unitTestRunner: 'jest' | 'none';
+  e2eTestRunner: 'cypress' | 'none';
+  linter: Linter;
+  pascalCaseFiles?: boolean;
+  classComponent?: boolean;
+  skipWorkspaceJson?: boolean;
+  js?: boolean;
+  globalCss?: boolean;
+  strict?: boolean;
+  setParserOptionsProject?: boolean;
+  standaloneConfig?: boolean;
+  compiler?: 'babel' | 'swc';
+  devServerPort?: number;
+  remotes?: string[];
+}
+
+export interface NormalizedSchema extends Schema {
+  appProjectRoot: string;
+}

package/src/generators/mfe-host/schema.json

@@ -0,0 +1,155 @@
+{
+  "$schema": "http://json-schema.org/schema",
+  "$id": "GeneratorReactMFEHost",
+  "cli": "nx",
+  "title": "Generate Module Federation Setup for React Host App",
+  "description": "Create Module Federation configuration files for given React Host Application.",
+  "type": "object",
+  "properties": {
+    "name": {
+      "type": "string",
+      "description": "The name of the host application to generate the Module Federation configuration",
+      "$default": {
+        "$source": "argv",
+        "index": 0
+      },
+      "x-prompt": "What name would you like to use as the host application?",
+      "pattern": "^[a-zA-Z].*$"
+    },
+    "directory": {
+      "description": "The directory of the new application.",
+      "type": "string",
+      "alias": "dir"
+    },
+    "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": "styl",
+            "label": "Stylus(.styl)     [ http://stylus-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": "none",
+            "label": "None"
+          }
+        ]
+      }
+    },
+    "linter": {
+      "description": "The tool to use for running lint checks.",
+      "type": "string",
+      "enum": ["eslint", "tslint"],
+      "default": "eslint"
+    },
+    "skipFormat": {
+      "description": "Skip formatting files.",
+      "type": "boolean",
+      "default": false
+    },
+    "skipWorkspaceJson": {
+      "description": "Skip updating workspace.json with default options based on values provided to this app (e.g. babel, style).",
+      "type": "boolean",
+      "default": false
+    },
+    "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"
+    },
+    "tags": {
+      "type": "string",
+      "description": "Add tags to the application (used for linting).",
+      "alias": "t"
+    },
+    "pascalCaseFiles": {
+      "type": "boolean",
+      "description": "Use pascal case component file name (e.g. App.tsx).",
+      "alias": "P",
+      "default": false
+    },
+    "classComponent": {
+      "type": "boolean",
+      "description": "Use class components instead of functional component.",
+      "alias": "C",
+      "default": false
+    },
+    "js": {
+      "type": "boolean",
+      "description": "Generate JavaScript files rather than TypeScript files.",
+      "default": false
+    },
+    "globalCss": {
+      "type": "boolean",
+      "description": "Default is false. When true, the component is generated with *.css/*.scss instead of *.module.css/*.module.scss",
+      "default": false
+    },
+    "strict": {
+      "type": "boolean",
+      "description": "Creates an application with strict mode and strict type checking",
+      "default": true
+    },
+    "setParserOptionsProject": {
+      "type": "boolean",
+      "description": "Whether or not to configure the ESLint \"parserOptions.project\" option. We do not do this by default for lint performance reasons.",
+      "default": false
+    },
+    "standaloneConfig": {
+      "description": "Split the project configuration into <projectRoot>/project.json rather than including it inside workspace.json",
+      "type": "boolean"
+    },
+    "compiler": {
+      "type": "string",
+      "description": "The compiler to use",
+      "enum": ["babel", "swc"],
+      "default": "babel"
+    },
+    "remotes": {
+      "type": "array",
+      "description": "A list of remote application names that the host application should consume.",
+      "default": []
+    },
+    "devServerPort": {
+      "type": "number",
+      "description": "The port for the dev server of the remote app."
+    }
+  },
+  "required": ["name"],
+  "additionalProperties": false
+}

package/src/generators/mfe-remote/files/mfe/mfe.config.js__tmpl__

@@ -0,0 +1,6 @@
+module.exports = {
+   name: '<%= projectName %>',
+   exposes: {
+     './Module': './src/remote-entry.ts',
+   },
+};

package/src/generators/mfe-remote/files/mfe/src/main.ts__tmpl__

@@ -0,0 +1 @@
+import('./bootstrap');

package/src/generators/mfe-remote/files/mfe/src/remote-entry.ts__tmpl__

@@ -0,0 +1 @@
+export { default } from './app/app';

package/src/generators/mfe-remote/files/mfe/webpack.config.js__tmpl__

@@ -0,0 +1,6 @@
+const withModuleFederation = require('@nrwl/react/module-federation');
+const mfeConfig = require('./mfe.config');
+
+module.exports = withModuleFederation({
+    ...mfeConfig,
+});

package/src/generators/mfe-remote/files/mfe/webpack.config.prod.js__tmpl__

@@ -0,0 +1 @@
+module.exports = require('./webpack.config');

package/src/generators/mfe-remote/lib/update-host-with-remote.d.ts

@@ -0,0 +1,2 @@
+import { Tree } from '@nrwl/devkit';
+export declare function updateHostWithRemote(host: Tree, hostName: string, remoteName: string): void;

package/src/generators/mfe-remote/lib/update-host-with-remote.js

@@ -0,0 +1,49 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.updateHostWithRemote = void 0;
+const devkit_1 = require("@nrwl/devkit");
+const mfe_ast_utils_1 = require("../../../mfe/mfe-ast-utils");
+const ts = require("typescript");
+function updateHostWithRemote(host, hostName, remoteName) {
+    const hostConfig = (0, devkit_1.readProjectConfiguration)(host, hostName);
+    const mfeConfigPath = (0, devkit_1.joinPathFragments)(hostConfig.root, 'mfe.config.js');
+    const remoteDefsPath = (0, devkit_1.joinPathFragments)(hostConfig.sourceRoot, 'remotes.d.ts');
+    const appComponentPath = findAppComponentPath(host, hostConfig.sourceRoot);
+    if (host.exists(mfeConfigPath)) {
+        // find the host project path
+        // Update remotes inside ${host_path}/src/remotes.d.ts
+        let sourceCode = host.read(mfeConfigPath).toString();
+        const source = ts.createSourceFile(mfeConfigPath, sourceCode, ts.ScriptTarget.Latest, true);
+        host.write(mfeConfigPath, (0, devkit_1.applyChangesToString)(sourceCode, (0, mfe_ast_utils_1.addRemoteToMfeConfig)(source, remoteName)));
+    }
+    else {
+        // TODO(jack): Point to the nx.dev guide when ready.
+        devkit_1.logger.warn(`Could not find MFE configuration at ${mfeConfigPath}. Did you generate this project with "@nrwl/react:mfe-host"?`);
+    }
+    if (host.exists(remoteDefsPath)) {
+        let sourceCode = host.read(remoteDefsPath).toString();
+        const source = ts.createSourceFile(mfeConfigPath, sourceCode, ts.ScriptTarget.Latest, true);
+        host.write(remoteDefsPath, (0, devkit_1.applyChangesToString)(sourceCode, (0, mfe_ast_utils_1.addRemoteDefinition)(source, remoteName)));
+    }
+    else {
+        devkit_1.logger.warn(`Could not find remote definitions at ${remoteDefsPath}. Did you generate this project with "@nrwl/react:mfe-host"?`);
+    }
+    if (host.exists(appComponentPath)) {
+        let sourceCode = host.read(appComponentPath).toString();
+        const source = ts.createSourceFile(mfeConfigPath, sourceCode, ts.ScriptTarget.Latest, true);
+        host.write(appComponentPath, (0, devkit_1.applyChangesToString)(sourceCode, (0, mfe_ast_utils_1.addRemoteRoute)(source, (0, devkit_1.names)(remoteName))));
+    }
+    else {
+        devkit_1.logger.warn(`Could not find app component at ${appComponentPath}. Did you generate this project with "@nrwl/react:mfe-host"?`);
+    }
+}
+exports.updateHostWithRemote = updateHostWithRemote;
+function findAppComponentPath(host, sourceRoot) {
+    const locations = ['app/app.tsx', 'app/App.tsx', 'app.tsx', 'App.tsx'];
+    for (const loc of locations) {
+        if (host.exists((0, devkit_1.joinPathFragments)(sourceRoot, loc))) {
+            return (0, devkit_1.joinPathFragments)(sourceRoot, loc);
+        }
+    }
+}
+//# sourceMappingURL=update-host-with-remote.js.map

package/src/generators/mfe-remote/lib/update-host-with-remote.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"update-host-with-remote.js","sourceRoot":"","sources":["../../../../../../../packages/react/src/generators/mfe-remote/lib/update-host-with-remote.ts"],"names":[],"mappings":";;;AAAA,yCAOsB;AACtB,8DAIoC;AACpC,iCAAiC;AAEjC,SAAgB,oBAAoB,CAClC,IAAU,EACV,QAAgB,EAChB,UAAkB;IAElB,MAAM,UAAU,GAAG,IAAA,iCAAwB,EAAC,IAAI,EAAE,QAAQ,CAAC,CAAC;IAC5D,MAAM,aAAa,GAAG,IAAA,0BAAiB,EAAC,UAAU,CAAC,IAAI,EAAE,eAAe,CAAC,CAAC;IAC1E,MAAM,cAAc,GAAG,IAAA,0BAAiB,EACtC,UAAU,CAAC,UAAU,EACrB,cAAc,CACf,CAAC;IACF,MAAM,gBAAgB,GAAG,oBAAoB,CAAC,IAAI,EAAE,UAAU,CAAC,UAAU,CAAC,CAAC;IAE3E,IAAI,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC,EAAE;QAC9B,6BAA6B;QAC7B,sDAAsD;QACtD,IAAI,UAAU,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,QAAQ,EAAE,CAAC;QACrD,MAAM,MAAM,GAAG,EAAE,CAAC,gBAAgB,CAChC,aAAa,EACb,UAAU,EACV,EAAE,CAAC,YAAY,CAAC,MAAM,EACtB,IAAI,CACL,CAAC;QACF,IAAI,CAAC,KAAK,CACR,aAAa,EACb,IAAA,6BAAoB,EAAC,UAAU,EAAE,IAAA,oCAAoB,EAAC,MAAM,EAAE,UAAU,CAAC,CAAC,CAC3E,CAAC;KACH;SAAM;QACL,oDAAoD;QACpD,eAAM,CAAC,IAAI,CACT,uCAAuC,aAAa,8DAA8D,CACnH,CAAC;KACH;IAED,IAAI,IAAI,CAAC,MAAM,CAAC,cAAc,CAAC,EAAE;QAC/B,IAAI,UAAU,GAAG,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,QAAQ,EAAE,CAAC;QACtD,MAAM,MAAM,GAAG,EAAE,CAAC,gBAAgB,CAChC,aAAa,EACb,UAAU,EACV,EAAE,CAAC,YAAY,CAAC,MAAM,EACtB,IAAI,CACL,CAAC;QACF,IAAI,CAAC,KAAK,CACR,cAAc,EACd,IAAA,6BAAoB,EAAC,UAAU,EAAE,IAAA,mCAAmB,EAAC,MAAM,EAAE,UAAU,CAAC,CAAC,CAC1E,CAAC;KACH;SAAM;QACL,eAAM,CAAC,IAAI,CACT,wCAAwC,cAAc,8DAA8D,CACrH,CAAC;KACH;IAED,IAAI,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,EAAE;QACjC,IAAI,UAAU,GAAG,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC,QAAQ,EAAE,CAAC;QACxD,MAAM,MAAM,GAAG,EAAE,CAAC,gBAAgB,CAChC,aAAa,EACb,UAAU,EACV,EAAE,CAAC,YAAY,CAAC,MAAM,EACtB,IAAI,CACL,CAAC;QACF,IAAI,CAAC,KAAK,CACR,gBAAgB,EAChB,IAAA,6BAAoB,EAClB,UAAU,EACV,IAAA,8BAAc,EAAC,MAAM,EAAE,IAAA,cAAK,EAAC,UAAU,CAAC,CAAC,CAC1C,CACF,CAAC;KACH;SAAM;QACL,eAAM,CAAC,IAAI,CACT,mCAAmC,gBAAgB,8DAA8D,CAClH,CAAC;KACH;AACH,CAAC;AAxED,oDAwEC;AAED,SAAS,oBAAoB,CAAC,IAAU,EAAE,UAAkB;IAC1D,MAAM,SAAS,GAAG,CAAC,aAAa,EAAE,aAAa,EAAE,SAAS,EAAE,SAAS,CAAC,CAAC;IACvE,KAAK,MAAM,GAAG,IAAI,SAAS,EAAE;QAC3B,IAAI,IAAI,CAAC,MAAM,CAAC,IAAA,0BAAiB,EAAC,UAAU,EAAE,GAAG,CAAC,CAAC,EAAE;YACnD,OAAO,IAAA,0BAAiB,EAAC,UAAU,EAAE,GAAG,CAAC,CAAC;SAC3C;KACF;AACH,CAAC"}

package/src/generators/mfe-remote/mfe-remote.d.ts

@@ -0,0 +1,6 @@
+import { Tree } from '@nrwl/devkit';
+import { NormalizedSchema } from '../application/schema';
+import { Schema } from './schema';
+export declare function addMfeFiles(host: Tree, options: NormalizedSchema): void;
+export declare function mfeRemoteGenerator(host: Tree, schema: Schema): Promise<import("@nrwl/devkit").GeneratorCallback>;
+export default mfeRemoteGenerator;

package/src/generators/mfe-remote/mfe-remote.js

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.mfeRemoteGenerator = exports.addMfeFiles = void 0;
+const tslib_1 = require("tslib");
+const path_1 = require("path");
+const devkit_1 = require("@nrwl/devkit");
+const run_tasks_in_serial_1 = require("@nrwl/workspace/src/utilities/run-tasks-in-serial");
+const normalize_options_1 = require("../application/lib/normalize-options");
+const application_1 = require("../application/application");
+const update_host_with_remote_1 = require("./lib/update-host-with-remote");
+const update_mfe_project_1 = require("../../rules/update-mfe-project");
+function addMfeFiles(host, options) {
+    const templateVariables = Object.assign(Object.assign(Object.assign({}, (0, devkit_1.names)(options.name)), options), { tmpl: '' });
+    (0, devkit_1.generateFiles)(host, (0, path_1.join)(__dirname, `./files/mfe`), options.appProjectRoot, templateVariables);
+}
+exports.addMfeFiles = addMfeFiles;
+function mfeRemoteGenerator(host, schema) {
+    return tslib_1.__awaiter(this, void 0, void 0, function* () {
+        const options = (0, normalize_options_1.normalizeOptions)(host, schema);
+        const initApp = yield (0, application_1.default)(host, options);
+        if (schema.host) {
+            (0, update_host_with_remote_1.updateHostWithRemote)(host, schema.host, options.name);
+        }
+        // Module federation requires bootstrap code to be dynamically imported.
+        // Renaming original entry file so we can use `import(./bootstrap)` in
+        // new entry file.
+        host.rename((0, path_1.join)(options.appProjectRoot, 'src/main.tsx'), (0, path_1.join)(options.appProjectRoot, 'src/bootstrap.tsx'));
+        addMfeFiles(host, options);
+        (0, update_mfe_project_1.updateMfeProject)(host, options);
+        if (!options.skipFormat) {
+            yield (0, devkit_1.formatFiles)(host);
+        }
+        return (0, run_tasks_in_serial_1.runTasksInSerial)(initApp);
+    });
+}
+exports.mfeRemoteGenerator = mfeRemoteGenerator;
+exports.default = mfeRemoteGenerator;
+//# sourceMappingURL=mfe-remote.js.map

package/src/generators/mfe-remote/mfe-remote.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mfe-remote.js","sourceRoot":"","sources":["../../../../../../packages/react/src/generators/mfe-remote/mfe-remote.ts"],"names":[],"mappings":";;;;AAAA,+BAA4B;AAC5B,yCAAuE;AACvE,2FAAqF;AAErF,4EAAwE;AACxE,4DAA8D;AAE9D,2EAAqE;AACrE,uEAAkE;AAGlE,SAAgB,WAAW,CAAC,IAAU,EAAE,OAAyB;IAC/D,MAAM,iBAAiB,iDAClB,IAAA,cAAK,EAAC,OAAO,CAAC,IAAI,CAAC,GACnB,OAAO,KACV,IAAI,EAAE,EAAE,GACT,CAAC;IAEF,IAAA,sBAAa,EACX,IAAI,EACJ,IAAA,WAAI,EAAC,SAAS,EAAE,aAAa,CAAC,EAC9B,OAAO,CAAC,cAAc,EACtB,iBAAiB,CAClB,CAAC;AACJ,CAAC;AAbD,kCAaC;AAED,SAAsB,kBAAkB,CAAC,IAAU,EAAE,MAAc;;QACjE,MAAM,OAAO,GAAG,IAAA,oCAAgB,EAAC,IAAI,EAAE,MAAM,CAAC,CAAC;QAC/C,MAAM,OAAO,GAAG,MAAM,IAAA,qBAAoB,EAAC,IAAI,EAAE,OAAO,CAAC,CAAC;QAE1D,IAAI,MAAM,CAAC,IAAI,EAAE;YACf,IAAA,8CAAoB,EAAC,IAAI,EAAE,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,IAAI,CAAC,CAAC;SACvD;QAED,wEAAwE;QACxE,sEAAsE;QACtE,kBAAkB;QAClB,IAAI,CAAC,MAAM,CACT,IAAA,WAAI,EAAC,OAAO,CAAC,cAAc,EAAE,cAAc,CAAC,EAC5C,IAAA,WAAI,EAAC,OAAO,CAAC,cAAc,EAAE,mBAAmB,CAAC,CAClD,CAAC;QAEF,WAAW,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;QAC3B,IAAA,qCAAgB,EAAC,IAAI,EAAE,OAAO,CAAC,CAAC;QAEhC,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE;YACvB,MAAM,IAAA,oBAAW,EAAC,IAAI,CAAC,CAAC;SACzB;QAED,OAAO,IAAA,sCAAgB,EAAC,OAAO,CAAC,CAAC;IACnC,CAAC;CAAA;AAxBD,gDAwBC;AAED,kBAAe,kBAAkB,CAAC"}

package/src/generators/mfe-remote/schema.d.ts

@@ -0,0 +1,26 @@
+import { Linter } from '@nrwl/linter';
+
+import { SupportedStyles } from '../../../typings';
+
+export interface Schema {
+  name: string;
+  style: SupportedStyles;
+  skipFormat: boolean;
+  directory?: string;
+  tags?: string;
+  unitTestRunner: 'jest' | 'none';
+  e2eTestRunner: 'cypress' | 'none';
+  linter: Linter;
+  pascalCaseFiles?: boolean;
+  classComponent?: boolean;
+  routing?: boolean;
+  skipWorkspaceJson?: boolean;
+  js?: boolean;
+  globalCss?: boolean;
+  strict?: boolean;
+  setParserOptionsProject?: boolean;
+  standaloneConfig?: boolean;
+  compiler?: 'babel' | 'swc';
+  host?: string;
+  devServerPort?: number;
+}

package/src/generators/mfe-remote/schema.json

@@ -0,0 +1,159 @@
+{
+  "$schema": "http://json-schema.org/schema",
+  "$id": "GeneratorReactMFERemote",
+  "cli": "nx",
+  "title": "Generate Module Federation Setup for React Remote App",
+  "description": "Create Module Federation configuration files for given React Remote Application.",
+  "type": "object",
+  "properties": {
+    "name": {
+      "type": "string",
+      "description": "The name of the remote application to generate the Module Federation configuration",
+      "$default": {
+        "$source": "argv",
+        "index": 0
+      },
+      "x-prompt": "What name would you like to use as the remote application?",
+      "pattern": "^[a-zA-Z].*$"
+    },
+    "directory": {
+      "description": "The directory of the new application.",
+      "type": "string",
+      "alias": "dir"
+    },
+    "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": "styl",
+            "label": "Stylus(.styl)     [ http://stylus-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": "none",
+            "label": "None"
+          }
+        ]
+      }
+    },
+    "linter": {
+      "description": "The tool to use for running lint checks.",
+      "type": "string",
+      "enum": ["eslint", "tslint"],
+      "default": "eslint"
+    },
+    "routing": {
+      "type": "boolean",
+      "description": "Generate application with routes.",
+      "default": false
+    },
+    "skipFormat": {
+      "description": "Skip formatting files.",
+      "type": "boolean",
+      "default": false
+    },
+    "skipWorkspaceJson": {
+      "description": "Skip updating workspace.json with default options based on values provided to this app (e.g. babel, style).",
+      "type": "boolean",
+      "default": false
+    },
+    "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"
+    },
+    "tags": {
+      "type": "string",
+      "description": "Add tags to the application (used for linting).",
+      "alias": "t"
+    },
+    "pascalCaseFiles": {
+      "type": "boolean",
+      "description": "Use pascal case component file name (e.g. App.tsx).",
+      "alias": "P",
+      "default": false
+    },
+    "classComponent": {
+      "type": "boolean",
+      "description": "Use class components instead of functional component.",
+      "alias": "C",
+      "default": false
+    },
+    "js": {
+      "type": "boolean",
+      "description": "Generate JavaScript files rather than TypeScript files.",
+      "default": false
+    },
+    "globalCss": {
+      "type": "boolean",
+      "description": "Default is false. When true, the component is generated with *.css/*.scss instead of *.module.css/*.module.scss.",
+      "default": false
+    },
+    "strict": {
+      "type": "boolean",
+      "description": "Creates an application with strict mode and strict type checking.",
+      "default": true
+    },
+    "setParserOptionsProject": {
+      "type": "boolean",
+      "description": "Whether or not to configure the ESLint \"parserOptions.project\" option. We do not do this by default for lint performance reasons.",
+      "default": false
+    },
+    "standaloneConfig": {
+      "description": "Split the project configuration into <projectRoot>/project.json rather than including it inside workspace.json",
+      "type": "boolean"
+    },
+    "compiler": {
+      "type": "string",
+      "description": "The compiler to use.",
+      "enum": ["babel", "swc"],
+      "default": "babel"
+    },
+    "host": {
+      "type": "string",
+      "description": "The host / shell application for this remote."
+    },
+    "devServerPort": {
+      "type": "number",
+      "description": "The port for the dev server of the remote app."
+    }
+  },
+  "required": ["name"],
+  "additionalProperties": false
+}

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

@@ -9,4 +9,5 @@ export interface StorybookConfigureSchema {
   linter?: Linter;
   cypressDirectory?: string;
   standaloneConfig?: boolean;
+  projectBuildConfig?: string;
 }

package/src/generators/storybook-configuration/schema.json

@@ -47,6 +47,10 @@
       "enum": ["eslint", "tslint"],
       "default": "eslint"
     },
+    "projectBuildConfig": {
+      "description": "Provide a custom projectBuildConfig for the Angular executor. If left blank, Nx will use the default.",
+      "type": "string"
+    },
     "standaloneConfig": {
       "description": "Split the project configuration into `<projectRoot>/project.json` rather than including it inside `workspace.json`.",
       "type": "boolean"

package/src/mfe/mfe-ast-utils.d.ts

@@ -0,0 +1,8 @@
+import * as ts from 'typescript';
+import { StringChange } from '@nrwl/devkit';
+export declare function addRemoteToMfeConfig(source: ts.SourceFile, app: string): StringChange[];
+export declare function addRemoteDefinition(source: ts.SourceFile, app: string): StringChange[];
+export declare function addRemoteRoute(source: ts.SourceFile, names: {
+    fileName: string;
+    className: string;
+}): StringChange[];