@nrwl/react 14.8.8 → 14.9.0-beta.1

package/src/generators/remote/files/module-federation/module-federation.config.js__tmpl__

@@ -1,13 +1,6 @@
-// @ts-check
-
-/**
- * @type {import('@nrwl/react/module-federation').ModuleFederationConfig}
- **/
-const moduleFederationConfig = {
+module.exports = {
    name: '<%= projectName %>',
    exposes: {
      './Module': './src/remote-entry.ts',
    },
 };
-
-module.exports = moduleFederationConfig;

package/src/generators/remote/files/module-federation/webpack.config.js__tmpl__

@@ -1,13 +1,12 @@
-// @ts-check
-
+const { composePlugins, withNx } = require('@nrwl/webpack');
+const { withReact } = require('@nrwl/react');
 const { withModuleFederation } = require('@nrwl/react/module-federation');
+
 const baseConfig = require('./module-federation.config');
 
-/**
- * @type {import('@nrwl/react/module-federation').ModuleFederationConfig}
- **/
-const defaultConfig = {
-    ...baseConfig,
+const config = {
+  ...baseConfig,
 };
 
-module.exports = withModuleFederation(defaultConfig);
+// Nx plugins for webpack to build config object from Nx options and context.
+module.exports = composePlugins(withNx(), withReact(), withModuleFederation(config));

package/src/generators/remote/files/module-federation-ssr/module-federation.server.config.js__tmpl__

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

package/src/generators/remote/files/module-federation-ssr/server.ts__tmpl__

@@ -0,0 +1,45 @@
+import * as path from 'path';
+import express from 'express';
+import cors from 'cors';
+
+import { handleRequest } from './src/main.server';
+
+const port = process.env['PORT'] || 4200;
+const app = express();
+
+const browserDist = path.join(process.cwd(), '<%= browserBuildOutputPath %>');
+const serverDist = path.join(process.cwd(), '<%= serverBuildOutputPath %>');
+const indexPath = path.join(browserDist, 'index.html');
+
+app.use(cors());
+
+// Client-side static bundles
+app.get(
+  '*.*',
+  express.static(browserDist, {
+    maxAge: '1y',
+  })
+);
+
+// Static bundles for server-side module federation
+app.use('/server',
+  express.static(serverDist, {
+    maxAge: '1y'
+  })
+);
+
+app.use('*', handleRequest(indexPath));
+
+const server = app.listen(port, () => {
+  console.log(`Express server listening on http://localhost:${port}`);
+
+  /**
+   * DO NOT REMOVE IF USING @nrwl/react:module-federation-dev-ssr executor
+   * to serve your Host application with this Remote application.
+   * This message allows Nx to determine when the Remote is ready to be
+   * consumed by the Host.
+   */
+  process.send?.('nx.server.ready');
+});
+
+server.on('error', console.error);

package/src/generators/remote/files/module-federation-ssr/webpack.server.config.js__tmpl__

@@ -0,0 +1,12 @@
+const { composePlugins, withNx } = require('@nrwl/webpack');
+const { withReact } = require('@nrwl/react');
+const { withModuleFederationForSSR } = require('@nrwl/react/module-federation');
+
+const baseConfig = require("./module-federation.server.config");
+
+const defaultConfig = {
+  ...baseConfig,
+};
+
+// Nx plugins for webpack to build config object from Nx options and context.
+module.exports = composePlugins(withNx(), withReact(), withModuleFederationForSSR(defaultConfig));

package/src/generators/remote/lib/setup-ssr-for-remote.d.ts

@@ -0,0 +1,4 @@
+import type { GeneratorCallback, Tree } from '@nrwl/devkit';
+import { NormalizedSchema } from '../../application/schema';
+import type { Schema } from '../schema';
+export declare function setupSsrForRemote(tree: Tree, options: NormalizedSchema<Schema>, appName: string): Promise<GeneratorCallback>;

package/src/generators/remote/lib/setup-ssr-for-remote.js

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.setupSsrForRemote = void 0;
+const tslib_1 = require("tslib");
+const devkit_1 = require("@nrwl/devkit");
+const versions_1 = require("../../../utils/versions");
+function setupSsrForRemote(tree, options, appName) {
+    var _a, _b, _c;
+    return tslib_1.__awaiter(this, void 0, void 0, function* () {
+        const tasks = [];
+        const project = (0, devkit_1.readProjectConfiguration)(tree, appName);
+        (0, devkit_1.generateFiles)(tree, (0, devkit_1.joinPathFragments)(__dirname, '../files/module-federation-ssr'), project.root, Object.assign(Object.assign({}, options), { appName, tmpl: '', browserBuildOutputPath: project.targets.build.options.outputPath, serverBuildOutputPath: project.targets.server.options.outputPath }));
+        // For hosts to use when running remotes in static mode.
+        const originalOutputPath = (_b = (_a = project.targets.build) === null || _a === void 0 ? void 0 : _a.options) === null || _b === void 0 ? void 0 : _b.outputPath;
+        project.targets['serve-static'] = {
+            dependsOn: ['build', 'server'],
+            executor: 'nx:run-commands',
+            defaultConfiguration: 'development',
+            options: {
+                command: `PORT=${(_c = options.devServerPort) !== null && _c !== void 0 ? _c : 4200} node ${(0, devkit_1.joinPathFragments)(originalOutputPath, 'server', 'main.js')}`,
+            },
+        };
+        (0, devkit_1.updateProjectConfiguration)(tree, appName, project);
+        const installTask = (0, devkit_1.addDependenciesToPackageJson)(tree, {
+            '@module-federation/node': versions_1.moduleFederationNodeVersion,
+        }, {});
+        tasks.push(installTask);
+        return (0, devkit_1.runTasksInSerial)(...tasks);
+    });
+}
+exports.setupSsrForRemote = setupSsrForRemote;
+//# sourceMappingURL=setup-ssr-for-remote.js.map

package/src/generators/remote/lib/setup-ssr-for-remote.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"setup-ssr-for-remote.js","sourceRoot":"","sources":["../../../../../../../packages/react/src/generators/remote/lib/setup-ssr-for-remote.ts"],"names":[],"mappings":";;;;AACA,yCAOsB;AAItB,sDAAsE;AAEtE,SAAsB,iBAAiB,CACrC,IAAU,EACV,OAAiC,EACjC,OAAe;;;QAEf,MAAM,KAAK,GAAwB,EAAE,CAAC;QACtC,MAAM,OAAO,GAAG,IAAA,iCAAwB,EAAC,IAAI,EAAE,OAAO,CAAC,CAAC;QAExD,IAAA,sBAAa,EACX,IAAI,EACJ,IAAA,0BAAiB,EAAC,SAAS,EAAE,gCAAgC,CAAC,EAC9D,OAAO,CAAC,IAAI,kCAEP,OAAO,KACV,OAAO,EACP,IAAI,EAAE,EAAE,EACR,sBAAsB,EAAE,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,EAChE,qBAAqB,EAAE,OAAO,CAAC,OAAO,CAAC,MAAM,CAAC,OAAO,CAAC,UAAU,IAEnE,CAAC;QAEF,wDAAwD;QACxD,MAAM,kBAAkB,GAAG,MAAA,MAAA,OAAO,CAAC,OAAO,CAAC,KAAK,0CAAE,OAAO,0CAAE,UAAU,CAAC;QACtE,OAAO,CAAC,OAAO,CAAC,cAAc,CAAC,GAAG;YAChC,SAAS,EAAE,CAAC,OAAO,EAAE,QAAQ,CAAC;YAC9B,QAAQ,EAAE,iBAAiB;YAC3B,oBAAoB,EAAE,aAAa;YACnC,OAAO,EAAE;gBACP,OAAO,EAAE,QAAQ,MAAA,OAAO,CAAC,aAAa,mCAAI,IAAI,SAAS,IAAA,0BAAiB,EACtE,kBAAkB,EAClB,QAAQ,EACR,SAAS,CACV,EAAE;aACJ;SACF,CAAC;QACF,IAAA,mCAA0B,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,CAAC,CAAC;QAEnD,MAAM,WAAW,GAAG,IAAA,qCAA4B,EAC9C,IAAI,EACJ;YACE,yBAAyB,EAAE,sCAA2B;SACvD,EACD,EAAE,CACH,CAAC;QACF,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;QAExB,OAAO,IAAA,yBAAgB,EAAC,GAAG,KAAK,CAAC,CAAC;;CACnC;AA/CD,8CA+CC"}

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

@@ -3,8 +3,12 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.updateHostWithRemote = void 0;
 const devkit_1 = require("@nrwl/devkit");
 const ast_utils_1 = require("../../../module-federation/ast-utils");
-const ts = require("typescript");
+const ensure_typescript_1 = require("@nrwl/js/src/utils/typescript/ensure-typescript");
+let tsModule;
 function updateHostWithRemote(host, hostName, remoteName) {
+    if (!tsModule) {
+        tsModule = (0, ensure_typescript_1.ensureTypescript)();
+    }
     const hostConfig = (0, devkit_1.readProjectConfiguration)(host, hostName);
     const moduleFederationConfigPath = (0, devkit_1.joinPathFragments)(hostConfig.root, 'module-federation.config.js');
     const remoteDefsPath = (0, devkit_1.joinPathFragments)(hostConfig.sourceRoot, 'remotes.d.ts');
@@ -13,7 +17,7 @@ function updateHostWithRemote(host, hostName, remoteName) {
         // find the host project path
         // Update remotes inside ${host_path}/src/remotes.d.ts
         let sourceCode = host.read(moduleFederationConfigPath).toString();
-        const source = ts.createSourceFile(moduleFederationConfigPath, sourceCode, ts.ScriptTarget.Latest, true);
+        const source = tsModule.createSourceFile(moduleFederationConfigPath, sourceCode, tsModule.ScriptTarget.Latest, true);
         host.write(moduleFederationConfigPath, (0, devkit_1.applyChangesToString)(sourceCode, (0, ast_utils_1.addRemoteToConfig)(source, remoteName)));
     }
     else {
@@ -22,7 +26,7 @@ function updateHostWithRemote(host, hostName, remoteName) {
     }
     if (host.exists(remoteDefsPath)) {
         let sourceCode = host.read(remoteDefsPath).toString();
-        const source = ts.createSourceFile(moduleFederationConfigPath, sourceCode, ts.ScriptTarget.Latest, true);
+        const source = tsModule.createSourceFile(moduleFederationConfigPath, sourceCode, tsModule.ScriptTarget.Latest, true);
         host.write(remoteDefsPath, (0, devkit_1.applyChangesToString)(sourceCode, (0, ast_utils_1.addRemoteDefinition)(source, remoteName)));
     }
     else {
@@ -30,7 +34,7 @@ function updateHostWithRemote(host, hostName, remoteName) {
     }
     if (host.exists(appComponentPath)) {
         let sourceCode = host.read(appComponentPath).toString();
-        const source = ts.createSourceFile(moduleFederationConfigPath, sourceCode, ts.ScriptTarget.Latest, true);
+        const source = tsModule.createSourceFile(moduleFederationConfigPath, sourceCode, tsModule.ScriptTarget.Latest, true);
         host.write(appComponentPath, (0, devkit_1.applyChangesToString)(sourceCode, (0, ast_utils_1.addRemoteRoute)(source, (0, devkit_1.names)(remoteName))));
     }
     else {

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

@@ -1 +1 @@
-{"version":3,"file":"update-host-with-remote.js","sourceRoot":"","sources":["../../../../../../../packages/react/src/generators/remote/lib/update-host-with-remote.ts"],"names":[],"mappings":";;;AAAA,yCAOsB;AACtB,oEAI8C;AAC9C,iCAAiC;AAEjC,SAAgB,oBAAoB,CAClC,IAAU,EACV,QAAgB,EAChB,UAAkB;IAElB,MAAM,UAAU,GAAG,IAAA,iCAAwB,EAAC,IAAI,EAAE,QAAQ,CAAC,CAAC;IAC5D,MAAM,0BAA0B,GAAG,IAAA,0BAAiB,EAClD,UAAU,CAAC,IAAI,EACf,6BAA6B,CAC9B,CAAC;IACF,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,0BAA0B,CAAC,EAAE;QAC3C,6BAA6B;QAC7B,sDAAsD;QACtD,IAAI,UAAU,GAAG,IAAI,CAAC,IAAI,CAAC,0BAA0B,CAAC,CAAC,QAAQ,EAAE,CAAC;QAClE,MAAM,MAAM,GAAG,EAAE,CAAC,gBAAgB,CAChC,0BAA0B,EAC1B,UAAU,EACV,EAAE,CAAC,YAAY,CAAC,MAAM,EACtB,IAAI,CACL,CAAC;QACF,IAAI,CAAC,KAAK,CACR,0BAA0B,EAC1B,IAAA,6BAAoB,EAAC,UAAU,EAAE,IAAA,6BAAiB,EAAC,MAAM,EAAE,UAAU,CAAC,CAAC,CACxE,CAAC;KACH;SAAM;QACL,oDAAoD;QACpD,eAAM,CAAC,IAAI,CACT,mCAAmC,0BAA0B,0DAA0D,CACxH,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,0BAA0B,EAC1B,UAAU,EACV,EAAE,CAAC,YAAY,CAAC,MAAM,EACtB,IAAI,CACL,CAAC;QACF,IAAI,CAAC,KAAK,CACR,cAAc,EACd,IAAA,6BAAoB,EAAC,UAAU,EAAE,IAAA,+BAAmB,EAAC,MAAM,EAAE,UAAU,CAAC,CAAC,CAC1E,CAAC;KACH;SAAM;QACL,eAAM,CAAC,IAAI,CACT,wCAAwC,cAAc,0DAA0D,CACjH,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,0BAA0B,EAC1B,UAAU,EACV,EAAE,CAAC,YAAY,CAAC,MAAM,EACtB,IAAI,CACL,CAAC;QACF,IAAI,CAAC,KAAK,CACR,gBAAgB,EAChB,IAAA,6BAAoB,EAClB,UAAU,EACV,IAAA,0BAAc,EAAC,MAAM,EAAE,IAAA,cAAK,EAAC,UAAU,CAAC,CAAC,CAC1C,CACF,CAAC;KACH;SAAM;QACL,eAAM,CAAC,IAAI,CACT,mCAAmC,gBAAgB,0DAA0D,CAC9G,CAAC;KACH;AACH,CAAC;AA3ED,oDA2EC;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"}
+{"version":3,"file":"update-host-with-remote.js","sourceRoot":"","sources":["../../../../../../../packages/react/src/generators/remote/lib/update-host-with-remote.ts"],"names":[],"mappings":"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"}

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

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

package/src/generators/remote/remote.js

@@ -4,11 +4,12 @@ exports.remoteGenerator = exports.addModuleFederationFiles = 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_module_federation_project_1 = require("../../rules/update-module-federation-project");
+const setup_ssr_1 = require("../setup-ssr/setup-ssr");
+const setup_ssr_for_remote_1 = require("./lib/setup-ssr-for-remote");
 function addModuleFederationFiles(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/module-federation`), options.appProjectRoot, templateVariables);
@@ -16,8 +17,12 @@ function addModuleFederationFiles(host, options) {
 exports.addModuleFederationFiles = addModuleFederationFiles;
 function remoteGenerator(host, schema) {
     return tslib_1.__awaiter(this, void 0, void 0, function* () {
+        const tasks = [];
         const options = (0, normalize_options_1.normalizeOptions)(host, schema);
-        const initApp = yield (0, application_1.default)(host, Object.assign(Object.assign({}, options), { skipDefaultProject: true }));
+        const initAppTask = yield (0, application_1.default)(host, Object.assign(Object.assign({}, options), { 
+            // Only webpack works with module federation for now.
+            bundler: 'webpack' }));
+        tasks.push(initAppTask);
         if (schema.host) {
             (0, update_host_with_remote_1.updateHostWithRemote)(host, schema.host, options.name);
         }
@@ -27,10 +32,22 @@ function remoteGenerator(host, schema) {
         host.rename((0, path_1.join)(options.appProjectRoot, 'src/main.tsx'), (0, path_1.join)(options.appProjectRoot, 'src/bootstrap.tsx'));
         addModuleFederationFiles(host, options);
         (0, update_module_federation_project_1.updateModuleFederationProject)(host, options);
+        if (options.ssr) {
+            const setupSsrTask = yield (0, setup_ssr_1.default)(host, {
+                project: options.projectName,
+                serverPort: options.devServerPort,
+            });
+            tasks.push(setupSsrTask);
+            const setupSsrForRemoteTask = yield (0, setup_ssr_for_remote_1.setupSsrForRemote)(host, options, options.projectName);
+            tasks.push(setupSsrForRemoteTask);
+            const projectConfig = (0, devkit_1.readProjectConfiguration)(host, options.projectName);
+            projectConfig.targets.server.options.webpackConfig = (0, devkit_1.joinPathFragments)(projectConfig.root, 'webpack.server.config.js');
+            (0, devkit_1.updateProjectConfiguration)(host, options.projectName, projectConfig);
+        }
         if (!options.skipFormat) {
             yield (0, devkit_1.formatFiles)(host);
         }
-        return (0, run_tasks_in_serial_1.runTasksInSerial)(initApp);
+        return (0, devkit_1.runTasksInSerial)(...tasks);
     });
 }
 exports.remoteGenerator = remoteGenerator;

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

@@ -1 +1 @@
-{"version":3,"file":"remote.js","sourceRoot":"","sources":["../../../../../../packages/react/src/generators/remote/remote.ts"],"names":[],"mappings":";;;;AAAA,+BAA4B;AAC5B,yCAAuE;AACvE,2FAAqF;AAErF,4EAAwE;AACxE,4DAA8D;AAE9D,2EAAqE;AACrE,mGAA6F;AAG7F,SAAgB,wBAAwB,CACtC,IAAU,EACV,OAAyB;IAEzB,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,2BAA2B,CAAC,EAC5C,OAAO,CAAC,cAAc,EACtB,iBAAiB,CAClB,CAAC;AACJ,CAAC;AAhBD,4DAgBC;AAED,SAAsB,eAAe,CAAC,IAAU,EAAE,MAAc;;QAC9D,MAAM,OAAO,GAAG,IAAA,oCAAgB,EAAC,IAAI,EAAE,MAAM,CAAC,CAAC;QAC/C,MAAM,OAAO,GAAG,MAAM,IAAA,qBAAoB,EAAC,IAAI,kCAC1C,OAAO,KACV,kBAAkB,EAAE,IAAI,IACxB,CAAC;QAEH,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,wBAAwB,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;QACxC,IAAA,gEAA6B,EAAC,IAAI,EAAE,OAAO,CAAC,CAAC;QAE7C,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;AA3BD,0CA2BC;AAED,kBAAe,eAAe,CAAC"}
+{"version":3,"file":"remote.js","sourceRoot":"","sources":["../../../../../../packages/react/src/generators/remote/remote.ts"],"names":[],"mappings":";;;;AAAA,+BAA4B;AAC5B,yCAUsB;AAEtB,4EAAwE;AACxE,4DAA8D;AAE9D,2EAAqE;AACrE,mGAA6F;AAE7F,sDAAuD;AACvD,qEAA+D;AAE/D,SAAgB,wBAAwB,CACtC,IAAU,EACV,OAAyB;IAEzB,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,2BAA2B,CAAC,EAC5C,OAAO,CAAC,cAAc,EACtB,iBAAiB,CAClB,CAAC;AACJ,CAAC;AAhBD,4DAgBC;AAED,SAAsB,eAAe,CAAC,IAAU,EAAE,MAAc;;QAC9D,MAAM,KAAK,GAAwB,EAAE,CAAC;QACtC,MAAM,OAAO,GAAG,IAAA,oCAAgB,EAAS,IAAI,EAAE,MAAM,CAAC,CAAC;QACvD,MAAM,WAAW,GAAG,MAAM,IAAA,qBAAoB,EAAC,IAAI,kCAC9C,OAAO;YACV,qDAAqD;YACrD,OAAO,EAAE,SAAS,IAClB,CAAC;QACH,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;QAExB,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,wBAAwB,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;QACxC,IAAA,gEAA6B,EAAC,IAAI,EAAE,OAAO,CAAC,CAAC;QAE7C,IAAI,OAAO,CAAC,GAAG,EAAE;YACf,MAAM,YAAY,GAAG,MAAM,IAAA,mBAAiB,EAAC,IAAI,EAAE;gBACjD,OAAO,EAAE,OAAO,CAAC,WAAW;gBAC5B,UAAU,EAAE,OAAO,CAAC,aAAa;aAClC,CAAC,CAAC;YACH,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;YAEzB,MAAM,qBAAqB,GAAG,MAAM,IAAA,wCAAiB,EACnD,IAAI,EACJ,OAAO,EACP,OAAO,CAAC,WAAW,CACpB,CAAC;YACF,KAAK,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAC;YAElC,MAAM,aAAa,GAAG,IAAA,iCAAwB,EAAC,IAAI,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC;YAC1E,aAAa,CAAC,OAAO,CAAC,MAAM,CAAC,OAAO,CAAC,aAAa,GAAG,IAAA,0BAAiB,EACpE,aAAa,CAAC,IAAI,EAClB,0BAA0B,CAC3B,CAAC;YACF,IAAA,mCAA0B,EAAC,IAAI,EAAE,OAAO,CAAC,WAAW,EAAE,aAAa,CAAC,CAAC;SACtE;QAED,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE;YACvB,MAAM,IAAA,oBAAW,EAAC,IAAI,CAAC,CAAC;SACzB;QAED,OAAO,IAAA,yBAAgB,EAAC,GAAG,KAAK,CAAC,CAAC;IACpC,CAAC;CAAA;AApDD,0CAoDC;AAED,kBAAe,eAAe,CAAC"}

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

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

package/src/generators/remote/schema.json

@@ -14,12 +14,14 @@
         "index": 0
       },
       "x-prompt": "What name would you like to use as the remote application?",
-      "pattern": "^[a-zA-Z].*$"
+      "pattern": "^[a-zA-Z].*$",
+      "x-priority": "important"
     },
     "directory": {
       "description": "The directory of the new application.",
       "type": "string",
-      "alias": "dir"
+      "alias": "dir",
+      "x-priority": "important"
     },
     "style": {
       "description": "The file extension to be used for style files.",
@@ -68,7 +70,7 @@
     "linter": {
       "description": "The tool to use for running lint checks.",
       "type": "string",
-      "enum": ["eslint", "tslint"],
+      "enum": ["eslint"],
       "default": "eslint"
     },
     "routing": {
@@ -79,12 +81,14 @@
     "skipFormat": {
       "description": "Skip formatting files.",
       "type": "boolean",
-      "default": false
+      "default": false,
+      "x-priority": "internal"
     },
     "skipWorkspaceJson": {
       "description": "Skip updating workspace.json with default options based on values provided to this app (e.g. babel, style).",
       "type": "boolean",
-      "default": false
+      "default": false,
+      "x-priority": "internal"
     },
     "unitTestRunner": {
       "type": "string",
@@ -137,7 +141,9 @@
     },
     "standaloneConfig": {
       "description": "Split the project configuration into <projectRoot>/project.json rather than including it inside workspace.json",
-      "type": "boolean"
+      "type": "boolean",
+      "default": true,
+      "x-deprecated": "Nx only supports standaloneConfig"
     },
     "compiler": {
       "type": "string",
@@ -147,11 +153,19 @@
     },
     "host": {
       "type": "string",
-      "description": "The host / shell application for this remote."
+      "description": "The host / shell application for this remote.",
+      "x-priority": "important"
     },
     "devServerPort": {
       "type": "number",
-      "description": "The port for the dev server of the remote app."
+      "description": "The port for the dev server of the remote app.",
+      "default": 4200,
+      "x-priority": "important"
+    },
+    "ssr": {
+      "description": "Whether to configure SSR for the host application",
+      "type": "boolean",
+      "default": false
     }
   },
   "required": ["name"],

package/src/generators/setup-ssr/files/server.ts__tmpl__

@@ -0,0 +1,28 @@
+import * as path from 'path';
+import express from 'express';
+import cors from 'cors';
+
+import { handleRequest } from './src/main.server';
+
+const port = process.env['PORT'] || 4200;
+const app = express();
+
+const browserDist = path.join(process.cwd(), '<%= browserBuildOutputPath %>');
+const indexPath =path.join(browserDist, 'index.html');
+
+app.use(cors());
+
+app.get(
+  '*.*',
+  express.static(browserDist, {
+    maxAge: '1y',
+  })
+);
+
+app.use('*', handleRequest(indexPath));
+
+const server = app.listen(port, () => {
+  // Server has started
+});
+
+server.on('error', console.error);

package/src/generators/setup-ssr/files/src/main.server.tsx__tmpl__

@@ -0,0 +1,47 @@
+import type { Request, Response } from 'express';
+import * as fs from 'fs';
+import * as ReactDOMServer from 'react-dom/server';
+import isbot from 'isbot'
+
+import App from './<%= appComponentImport %>';
+
+
+let indexHtml: null | string = null;
+
+export function handleRequest(indexPath: string) {
+  return function render(req: Request, res: Response) {
+    let didError = false;
+
+    if (!indexHtml) {
+      indexHtml = fs.readFileSync(indexPath).toString();
+    }
+
+    const [htmlStart, htmlEnd] = indexHtml.split(`<div id="root"></div>`);
+
+    // For bots (e.g. search engines), the content will not be streamed but render all at once.
+    // For users, content should be streamed to the user as they are ready.
+    const callbackName = isbot(req.headers['user-agent']) ? 'onAllReady' : 'onShellReady';
+
+    const stream = ReactDOMServer.renderToPipeableStream(
+      <App />,
+      {
+        [callbackName]() {
+          res.statusCode = didError ? 500 : 200;
+          res.setHeader('Content-type', 'text/html; charset=utf-8');
+          res.write(`${htmlStart}<div id="root">`);
+          stream.pipe(res);
+          res.write(`</div>${htmlEnd}`);
+        },
+        onShellError(error) {
+          console.error(error);
+          res.statusCode = 500;
+          res.send('<!doctype html><h1>Server Error</h1>');
+        },
+        onError(error) {
+          didError = true;
+          console.error(error);
+        }
+      }
+    );
+  }
+}

package/src/generators/setup-ssr/files/tsconfig.server.json__tmpl__

@@ -0,0 +1,15 @@
+{
+  "extends": "./tsconfig.app.json",
+  "compilerOptions": {
+    "outDir": "../../out-tsc/server",
+    "target": "es2019",
+    "types": [
+      "node"
+    ]
+  },
+  "include": [
+    <%- extraInclude %>
+    "src/main.server.tsx",
+    "server.ts"
+  ]
+}

package/src/generators/setup-ssr/schema.d.ts

@@ -0,0 +1,7 @@
+export interface Schema {
+  project: string;
+  appComponentImportPath?: string;
+  serverPort?: number;
+  skipFormat?: boolean;
+  extraInclude?: string[];
+}

package/src/generators/setup-ssr/schema.json

@@ -0,0 +1,48 @@
+{
+  "$schema": "http://json-schema.org/schema",
+  "$id": "GeneratorReactSSRSetup",
+  "cli": "nx",
+  "title": "Generate SSR setup for a React app",
+  "description": "Create the additional configuration required to enable SSR via Express for a React application.",
+  "type": "object",
+  "properties": {
+    "project": {
+      "type": "string",
+      "description": "The name of the application to add SSR support to.",
+      "$default": {
+        "$source": "argv",
+        "index": 0
+      },
+      "x-prompt": "What app would you like to add SSR support to?",
+      "x-dropdown": "projects",
+      "x-priority": "important"
+    },
+    "appComponentImportPath": {
+      "type": "string",
+      "description": "The import path of the <App/ > component, relative to project sourceRoot.",
+      "default": "app/app"
+    },
+    "serverPort": {
+      "type": "number",
+      "default": 4200,
+      "description": "The port for the Express server.",
+      "x-priority": "important"
+    },
+    "skipFormat": {
+      "type": "boolean",
+      "description": "Skip formatting the workspace after the generator completes.",
+      "x-priority": "internal"
+    },
+    "extraInclude": {
+      "type": "array",
+      "items": {
+        "type": "string"
+      },
+      "hidden": true,
+      "description": "Extra include entries in tsconfig.",
+      "default": []
+    }
+  },
+  "required": ["project"],
+  "additionalProperties": false
+}

package/src/generators/setup-ssr/setup-ssr.d.ts

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