@nx/react 21.0.0-beta.0 → 21.0.0-beta.2

package/src/generators/library/library.js

@@ -2,30 +2,33 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.libraryGenerator = libraryGenerator;
 exports.libraryGeneratorInternal = libraryGeneratorInternal;
-const path_1 = require("path");
 const devkit_1 = require("@nx/devkit");
 const artifact_name_and_directory_utils_1 = require("@nx/devkit/src/generators/artifact-name-and-directory-utils");
 const log_show_project_command_1 = require("@nx/devkit/src/utils/log-show-project-command");
 const js_1 = require("@nx/js");
-const versions_1 = require("../../utils/versions");
+const path_1 = require("path");
+const add_release_config_1 = require("@nx/js/src/generators/library/utils/add-release-config");
+const sort_fields_1 = require("@nx/js/src/utils/package-json/sort-fields");
+const ts_solution_setup_1 = require("@nx/js/src/utils/typescript/ts-solution-setup");
+const use_legacy_versioning_1 = require("nx/src/command-line/release/config/use-legacy-versioning");
+const create_ts_config_1 = require("../../utils/create-ts-config");
+const jest_utils_1 = require("../../utils/jest-utils");
 const maybe_js_1 = require("../../utils/maybe-js");
+const versions_1 = require("../../utils/versions");
 const component_1 = require("../component/component");
 const init_1 = require("../init/init");
-const jest_utils_1 = require("../../utils/jest-utils");
-const normalize_options_1 = require("./lib/normalize-options");
-const add_rollup_build_target_1 = require("./lib/add-rollup-build-target");
 const add_linting_1 = require("./lib/add-linting");
-const update_app_routes_1 = require("./lib/update-app-routes");
+const add_rollup_build_target_1 = require("./lib/add-rollup-build-target");
 const create_files_1 = require("./lib/create-files");
-const create_ts_config_1 = require("../../utils/create-ts-config");
+const determine_entry_fields_1 = require("./lib/determine-entry-fields");
 const install_common_dependencies_1 = require("./lib/install-common-dependencies");
+const normalize_options_1 = require("./lib/normalize-options");
 const set_defaults_1 = require("./lib/set-defaults");
-const ts_solution_setup_1 = require("@nx/js/src/utils/typescript/ts-solution-setup");
-const determine_entry_fields_1 = require("./lib/determine-entry-fields");
-const sort_fields_1 = require("@nx/js/src/utils/package-json/sort-fields");
+const update_app_routes_1 = require("./lib/update-app-routes");
 async function libraryGenerator(host, schema) {
     return await libraryGeneratorInternal(host, {
         addPlugin: false,
+        useProjectJson: true,
         ...schema,
     });
 }
@@ -37,9 +40,6 @@ async function libraryGeneratorInternal(host, schema) {
     });
     tasks.push(jsInitTask);
     const options = await (0, normalize_options_1.normalizeOptions)(host, schema);
-    if (options.isUsingTsSolutionConfig) {
-        (0, ts_solution_setup_1.addProjectToTsSolutionWorkspace)(host, options.projectRoot);
-    }
     if (options.publishable === true && !schema.importPath) {
         throw new Error(`For publishable libs you have to provide a proper "--importPath" which needs to be a valid npm package name (e.g. my-awesome-lib or @myorg/my-lib)`);
     }
@@ -51,18 +51,20 @@ async function libraryGeneratorInternal(host, schema) {
         skipFormat: true,
     });
     tasks.push(initTask);
-    if (options.isUsingTsSolutionConfig) {
-        (0, devkit_1.writeJson)(host, `${options.projectRoot}/package.json`, {
-            name: options.importPath,
-            version: '0.0.1',
-            ...(0, determine_entry_fields_1.determineEntryFields)(options),
-            nx: options.parsedTags?.length
-                ? {
-                    tags: options.parsedTags,
-                }
-                : undefined,
-            files: options.publishable ? ['dist', '!**/*.tsbuildinfo'] : undefined,
-        });
+    const packageJson = {
+        name: options.importPath,
+        version: '0.0.1',
+        ...(0, determine_entry_fields_1.determineEntryFields)(options),
+        files: options.publishable ? ['dist', '!**/*.tsbuildinfo'] : undefined,
+    };
+    if (!options.useProjectJson) {
+        if (options.name !== options.importPath) {
+            packageJson.nx = { name: options.name };
+        }
+        if (options.parsedTags?.length) {
+            packageJson.nx ??= {};
+            packageJson.nx.tags = options.parsedTags;
+        }
     }
     else {
         (0, devkit_1.addProjectConfiguration)(host, options.name, {
@@ -73,7 +75,13 @@ async function libraryGeneratorInternal(host, schema) {
             targets: {},
         });
     }
+    if (!options.useProjectJson || options.isUsingTsSolutionConfig) {
+        (0, devkit_1.writeJson)(host, `${options.projectRoot}/package.json`, packageJson);
+    }
     (0, create_files_1.createFiles)(host, options);
+    if (options.isUsingTsSolutionConfig) {
+        await (0, ts_solution_setup_1.addProjectToTsSolutionWorkspace)(host, options.projectRoot);
+    }
     const lintTask = await (0, add_linting_1.addLinting)(host, options);
     tasks.push(lintTask);
     // Set up build target
@@ -183,11 +191,17 @@ async function libraryGeneratorInternal(host, schema) {
         });
         tasks.push(componentTask);
     }
-    if (options.publishable || options.buildable) {
-        (0, devkit_1.updateJson)(host, `${options.projectRoot}/package.json`, (json) => {
-            json.name = options.importPath;
-            return json;
-        });
+    if (options.publishable) {
+        const projectConfiguration = (0, devkit_1.readProjectConfiguration)(host, options.name);
+        if (options.isUsingTsSolutionConfig) {
+            await (0, add_release_config_1.addReleaseConfigForTsSolution)(host, options.name, projectConfiguration);
+        }
+        else {
+            const nxJson = (0, devkit_1.readNxJson)(host);
+            await (0, add_release_config_1.addReleaseConfigForNonTsSolution)((0, use_legacy_versioning_1.shouldUseLegacyVersioning)(nxJson.release), host, options.name, projectConfiguration);
+        }
+        (0, devkit_1.updateProjectConfiguration)(host, options.name, projectConfiguration);
+        tasks.push(await (0, add_release_config_1.releaseTasks)(host));
     }
     if (!options.skipPackageJson) {
         const installReactTask = await (0, install_common_dependencies_1.installCommonDependencies)(host, options);

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

@@ -27,6 +27,7 @@ export interface Schema {
   minimal?: boolean;
   simpleName?: boolean;
   addPlugin?: boolean;
+  useProjectJson?: boolean;
 }
 
 export interface NormalizedSchema extends Schema {
@@ -36,6 +37,7 @@ export interface NormalizedSchema extends Schema {
   projectRoot: string;
   routePath: string;
   parsedTags: string[];
+  importPath: string;
   appMain?: string;
   appSourceRoot?: string;
   unitTestRunner: 'jest' | 'vitest' | 'none';

package/src/generators/library/schema.json

@@ -190,6 +190,10 @@
       "description": "Don't include the directory in the name of the module of the library.",
       "type": "boolean",
       "default": false
+    },
+    "useProjectJson": {
+      "type": "boolean",
+      "description": "Use a `project.json` configuration file instead of inlining the Nx configuration in the `package.json` file."
     }
   },
   "required": ["directory"]

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

@@ -1,16 +1,43 @@
-const { composePlugins, withNx, withReact } = require('@nx/rspack');
-const { withModuleFederation } = require('@nx/module-federation/rspack');
+const { NxAppRspackPlugin } = require('@nx/rspack/app-plugin');
+const { NxReactRspackPlugin } = require('@nx/rspack/react-plugin');
+const { NxModuleFederationPlugin, NxModuleFederationDevServerPlugin } = require('@nx/module-federation/rspack');
+const { join } = require('path');
 
-const baseConfig = require('./module-federation.config');
+const config = require('./module-federation.config');
 
-const config = {
-  ...baseConfig,
+module.exports = {
+  output: {
+    path: join(__dirname, '<%= rspackPluginOptions.outputPath %>'),
+    publicPath: 'auto'
+  },
+  devServer: {
+    port: <%= devServerPort %>,
+    headers: {
+      "Access-Control-Allow-Origin": "*"
+    },
+    historyApiFallback: {
+      index: '/index.html',
+      disableDotRule: true,
+      htmlAcceptHeaders: ['text/html', 'application/xhtml+xml'],
+    },
+  },
+  plugins: [
+    new NxAppRspackPlugin({
+      tsConfig: '<%= rspackPluginOptions.tsConfig %>',
+      main: '<%= rspackPluginOptions.main %>',
+      index: '<%= rspackPluginOptions.index %>',
+      baseHref: '<%= rspackPluginOptions.baseHref %>',
+      assets: <%- JSON.stringify(rspackPluginOptions.assets) %>,
+      styles: <%- JSON.stringify(rspackPluginOptions.styles) %>,
+      outputHashing: process.env['NODE_ENV'] === 'production' ? 'all' : 'none',
+      optimization: process.env['NODE_ENV'] === 'production',
+    }),
+    new NxReactRspackPlugin({
+      // Uncomment this line if you don't want to use SVGR
+      // See: https://react-svgr.com/
+      // svgr: false
+    }),
+    new NxModuleFederationPlugin({ config }, { dts: false }),
+    new NxModuleFederationDevServerPlugin({ config }),
+  ],
 };
-
-// Nx plugins for rspack to build config object from Nx options and context.
-/**
- * DTS Plugin is disabled in Nx Workspaces as Nx already provides Typing support Module Federation
- * The DTS Plugin can be enabled by setting dts: true
- * Learn more about the DTS Plugin here: https://module-federation.io/configure/dts.html
- */
-module.exports = composePlugins(withNx(), withReact(), withModuleFederation(config, { dts: false }));

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

@@ -6,4 +6,10 @@ module.exports = {
   exposes: {
     './Module': './src/remote-entry.<%= js ? 'js' : 'ts' %>',
   },
+  shared: (libraryName, libraryConfig) => {
+      return {
+        ...libraryConfig,
+        eager: true
+      }
+    },
 };

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

@@ -0,0 +1,69 @@
+const { NxAppRspackPlugin } = require('@nx/rspack/app-plugin');
+const { NxReactRspackPlugin } = require('@nx/rspack/react-plugin');
+const { NxModuleFederationPlugin, NxModuleFederationSSRDevServerPlugin } = require('@nx/module-federation/rspack');
+const { join } = require('path');
+
+const browserMfConfig = require('./module-federation.config');
+const serverMfConfig = require('./module-federation.server.config');
+
+const browserRspackConfig = {
+  name: 'browser',
+  output: {
+    path: join(__dirname, '<%= rspackPluginOptions.outputPath %>', 'browser'),
+    publicPath: 'auto'
+  },
+  devServer: {
+    port: <%= devServerPort %>,
+    headers: {
+      "Access-Control-Allow-Origin": "*"
+    },
+    historyApiFallback: {
+      index: '/index.html',
+      disableDotRule: true,
+      htmlAcceptHeaders: ['text/html', 'application/xhtml+xml'],
+    },
+    devMiddleware: {
+      writeToDisk: (file: string) => !file.includes('.hot-update.'),
+    },
+  },
+  plugins: [
+    new NxAppRspackPlugin({
+      tsConfig: '<%= rspackPluginOptions.tsConfig %>',
+      main: '<%= rspackPluginOptions.main %>',
+      index: '<%= rspackPluginOptions.index %>',
+      baseHref: '<%= rspackPluginOptions.baseHref %>',
+      assets: <%- JSON.stringify(rspackPluginOptions.assets) %>,
+      styles: <%- JSON.stringify(rspackPluginOptions.styles) %>,
+      outputHashing: process.env['NODE_ENV'] === 'production' ? 'all' : 'none',
+      optimization: process.env['NODE_ENV'] === 'production',
+    }),
+    new NxReactRspackPlugin({
+      // Uncomment this line if you don't want to use SVGR
+      // See: https://react-svgr.com/
+      // svgr: false
+    }),
+    new NxModuleFederationPlugin({ config: browserMfConfig }, { dts: false }),
+  ],
+};
+
+const serverRspackConfig = {
+  name: 'server',
+    target: 'async-node',
+    output: {
+      path: join(__dirname, '<%= rspackPluginOptions.outputPath %>', 'server'),
+      filename: 'server.js'
+    },
+    plugins: [
+      new NxAppRspackPlugin({
+        outputPath: join(__dirname, '<%= rspackPluginOptions.outputPath %>', 'server'),
+        outputFileName: 'server.js',
+        tsConfig: '<%= rspackPluginOptions.tsConfig %>',
+        main: '<%= rspackPluginOptions.mainServer %>',
+        baseHref: '<%= rspackPluginOptions.baseHref %>',
+      }),
+      new NxModuleFederationPlugin({ config: serverMfConfig, isServer: true }, { dts: false }),
+      new NxModuleFederationSSRDevServerPlugin({ config: serverMfConfig }),
+    ],
+};
+
+module.exports = [browserRspackConfig, serverRspackConfig];

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

@@ -7,8 +7,8 @@ import { handleRequest } from './src/main.server';
 const port = process.env['PORT'] || <%= port %>;
 const app = express();
 
-const browserDist = path.join(process.cwd(), '<%= browserBuildOutputPath %>');
-const serverDist = path.join(process.cwd(), '<%= serverBuildOutputPath %>');
+const browserDist = path.join(process.cwd(), '<%= rspackPluginOptions.outputPath %>', 'browser');
+const serverDist = path.join(process.cwd(), '<%= rspackPluginOptions.outputPath %>', 'server');
 const indexPath = path.join(browserDist, 'index.html');
 
 app.use(cors());

package/src/generators/remote/files/rspack-module-federation-ssr/src/main.server.tsx__tmpl__

@@ -0,0 +1,45 @@
+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 './app/app';
+
+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/remote/files/rspack-module-federation-ssr-ts/module-federation.server.config.ts__tmpl__

@@ -5,6 +5,12 @@ const config: ModuleFederationConfig = {
   exposes: {
       './Module': './src/remote-entry.<%= js ? 'js' : 'ts' %>',
   },
+  shared: (libraryName, libraryConfig) => {
+      return {
+        ...libraryConfig,
+        eager: true
+      }
+    },
 };
 
 /**

package/src/generators/remote/files/rspack-module-federation-ssr-ts/rspack.config.ts__tmpl__

@@ -0,0 +1,69 @@
+import { NxAppRspackPlugin } from '@nx/rspack/app-plugin';
+import { NxReactRspackPlugin } from '@nx/rspack/react-plugin';
+import { NxModuleFederationPlugin, NxModuleFederationSSRDevServerPlugin } from '@nx/module-federation/rspack';
+import { join } from 'path';
+
+import browserMfConfig from './module-federation.config';
+import serverMfConfig from './module-federation.server.config';
+
+const browserRspackConfig = {
+  name: 'browser',
+  output: {
+    path: join(__dirname, '<%= rspackPluginOptions.outputPath %>', 'browser'),
+    publicPath: 'auto'
+  },
+  devServer: {
+    port: <%= devServerPort %>,
+    headers: {
+      "Access-Control-Allow-Origin": "*"
+    },
+    historyApiFallback: {
+      index: '/index.html',
+      disableDotRule: true,
+      htmlAcceptHeaders: ['text/html', 'application/xhtml+xml'],
+    },
+    devMiddleware: {
+      writeToDisk: (file: string) => !file.includes('.hot-update.'),
+    },
+  },
+  plugins: [
+    new NxAppRspackPlugin({
+      tsConfig: '<%= rspackPluginOptions.tsConfig %>',
+      main: '<%= rspackPluginOptions.main %>',
+      index: '<%= rspackPluginOptions.index %>',
+      baseHref: '<%= rspackPluginOptions.baseHref %>',
+      assets: <%- JSON.stringify(rspackPluginOptions.assets) %>,
+      styles: <%- JSON.stringify(rspackPluginOptions.styles) %>,
+      outputHashing: process.env['NODE_ENV'] === 'production' ? 'all' : 'none',
+      optimization: process.env['NODE_ENV'] === 'production',
+    }),
+    new NxReactRspackPlugin({
+      // Uncomment this line if you don't want to use SVGR
+      // See: https://react-svgr.com/
+      // svgr: false
+    }),
+    new NxModuleFederationPlugin({ config: browserMfConfig }, { dts: false }),
+  ],
+};
+
+const serverRspackConfig = {
+  name: 'server',
+    target: 'async-node',
+    output: {
+      path: join(__dirname, '<%= rspackPluginOptions.outputPath %>', 'server'),
+      filename: 'server.js'
+    },
+    plugins: [
+      new NxAppRspackPlugin({
+        outputPath: join(__dirname, '<%= rspackPluginOptions.outputPath %>', 'server'),
+        outputFileName: 'server.js',
+        tsConfig: '<%= rspackPluginOptions.tsConfig %>',
+        main: '<%= rspackPluginOptions.mainServer %>',
+        baseHref: '<%= rspackPluginOptions.baseHref %>',
+      }),
+      new NxModuleFederationPlugin({ config: serverMfConfig, isServer: true }, { dts: false }),
+      new NxModuleFederationSSRDevServerPlugin({ config: serverMfConfig }),
+    ],
+};
+
+export default [browserRspackConfig, serverRspackConfig];

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

@@ -7,8 +7,8 @@ import { handleRequest } from './src/main.server';
 const port = process.env['PORT'] || <%= port %>;
 const app = express();
 
-const browserDist = path.join(process.cwd(), '<%= browserBuildOutputPath %>');
-const serverDist = path.join(process.cwd(), '<%= serverBuildOutputPath %>');
+const browserDist = path.join(process.cwd(), '<%= rspackPluginOptions.outputPath %>', 'browser');
+const serverDist = path.join(process.cwd(), '<%= rspackPluginOptions.outputPath %>', 'server');
 const indexPath = path.join(browserDist, 'index.html');
 
 app.use(cors());

package/src/generators/remote/files/rspack-module-federation-ssr-ts/src/main.server.tsx__tmpl__

@@ -0,0 +1,45 @@
+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 './app/app';
+
+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/remote/files/rspack-module-federation-ts/rspack.config.ts__tmpl__

@@ -1,16 +1,43 @@
-import {composePlugins, withNx, withReact} from '@nx/rspack';
-import {withModuleFederation} from '@nx/module-federation/rspack';
+import { NxAppRspackPlugin } from '@nx/rspack/app-plugin';
+import { NxReactRspackPlugin } from '@nx/rspack/react-plugin';
+import { NxModuleFederationPlugin, NxModuleFederationDevServerPlugin } from '@nx/module-federation/rspack';
+import { join } from 'path';
 
-import baseConfig from './module-federation.config';
+import config from './module-federation.config';
 
-const config = {
-  ...baseConfig,
+export default {
+  output: {
+    path: join(__dirname, '<%= rspackPluginOptions.outputPath %>'),
+    publicPath: 'auto'
+  },
+  devServer: {
+    port: <%= devServerPort %>,
+    headers: {
+      "Access-Control-Allow-Origin": "*"
+    },
+    historyApiFallback: {
+      index: '/index.html',
+      disableDotRule: true,
+      htmlAcceptHeaders: ['text/html', 'application/xhtml+xml'],
+    },
+  },
+  plugins: [
+    new NxAppRspackPlugin({
+      tsConfig: '<%= rspackPluginOptions.tsConfig %>',
+      main: '<%= rspackPluginOptions.main %>',
+      index: '<%= rspackPluginOptions.index %>',
+      baseHref: '<%= rspackPluginOptions.baseHref %>',
+      assets: <%- JSON.stringify(rspackPluginOptions.assets) %>,
+      styles: <%- JSON.stringify(rspackPluginOptions.styles) %>,
+      outputHashing: process.env['NODE_ENV'] === 'production' ? 'all' : 'none',
+      optimization: process.env['NODE_ENV'] === 'production',
+    }),
+    new NxReactRspackPlugin({
+      // Uncomment this line if you don't want to use SVGR
+      // See: https://react-svgr.com/
+      // svgr: false
+    }),
+    new NxModuleFederationPlugin({ config }, { dts: false }),
+    new NxModuleFederationDevServerPlugin({ config }),
+  ],
 };
-
-// Nx plugins for rspack to build config object from Nx options and context.
-/**
- * DTS Plugin is disabled in Nx Workspaces as Nx already provides Typing support Module Federation
- * The DTS Plugin can be enabled by setting dts: true
- * Learn more about the DTS Plugin here: https://module-federation.io/configure/dts.html
- */
-export default composePlugins(withNx(), withReact(), withModuleFederation(config, { dts: false }));

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

@@ -1,4 +1,4 @@
-import type { GeneratorCallback, Tree } from '@nx/devkit';
+import { GeneratorCallback, Tree } from '@nx/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

@@ -2,39 +2,61 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.setupSsrForRemote = setupSsrForRemote;
 const devkit_1 = require("@nx/devkit");
+const devkit_2 = require("@nx/devkit");
 const versions_1 = require("../../../utils/versions");
+const create_application_files_1 = require("../../application/lib/create-application-files");
 async function setupSsrForRemote(tree, options, appName) {
     const tasks = [];
-    const project = (0, devkit_1.readProjectConfiguration)(tree, appName);
+    const project = (0, devkit_2.readProjectConfiguration)(tree, appName);
     const pathToModuleFederationSsrFiles = options.typescriptConfiguration
         ? `${options.bundler === 'rspack' ? 'rspack-' : 'webpack-'}module-federation-ssr-ts`
         : `${options.bundler === 'rspack' ? 'rspack-' : 'webpack-'}module-federation-ssr`;
-    (0, devkit_1.generateFiles)(tree, (0, devkit_1.joinPathFragments)(__dirname, `../files/${pathToModuleFederationSsrFiles}`), project.root, {
-        ...options,
-        port: Number(options?.devServerPort) || 4200,
-        appName,
-        tmpl: '',
-        browserBuildOutputPath: project.targets.build.options.outputPath,
-        serverBuildOutputPath: project.targets.server.options.outputPath,
-    });
+    const templateVariables = options.bundler === 'rspack'
+        ? {
+            ...(0, create_application_files_1.getDefaultTemplateVariables)(tree, options),
+            rspackPluginOptions: {
+                ...(0, create_application_files_1.createNxRspackPluginOptions)(options, (0, devkit_1.offsetFromRoot)(options.appProjectRoot), false),
+                mainServer: `./server.ts`,
+            },
+            port: Number(options?.devServerPort) || 4200,
+            appName,
+        }
+        : {
+            ...options,
+            port: Number(options?.devServerPort) || 4200,
+            appName,
+            tmpl: '',
+            browserBuildOutputPath: project.targets.build?.options?.outputPath,
+            serverBuildOutputPath: project.targets.server?.options?.outputPath,
+        };
+    (0, devkit_2.generateFiles)(tree, (0, devkit_2.joinPathFragments)(__dirname, `../files/${pathToModuleFederationSsrFiles}`), project.root, templateVariables);
     // For hosts to use when running remotes in static mode.
-    const originalOutputPath = project.targets.build?.options?.outputPath;
+    const originalOutputPath = project.targets.build?.options?.outputPath ??
+        options.isUsingTsSolutionConfig
+        ? 'dist'
+        : (0, devkit_2.joinPathFragments)((0, devkit_1.offsetFromRoot)(options.appProjectRoot), 'dist', options.appProjectRoot != '.'
+            ? options.appProjectRoot
+            : options.projectName);
     const serverOptions = project.targets.server?.options;
     const serverOutputPath = serverOptions?.outputPath ??
-        (0, devkit_1.joinPathFragments)(originalOutputPath, 'server');
+        (0, devkit_2.joinPathFragments)(originalOutputPath, 'server');
     const serverOutputName = serverOptions?.outputFileName ?? 'main.js';
     project.targets['serve-static'] = {
         dependsOn: ['build', 'server'],
         executor: 'nx:run-commands',
         defaultConfiguration: 'development',
         options: {
-            command: `PORT=${options.devServerPort ?? 4200} node ${(0, devkit_1.joinPathFragments)(serverOutputPath, serverOutputName)}`,
+            command: `PORT=${options.devServerPort ?? 4200} node ${(0, devkit_2.joinPathFragments)(serverOutputPath, serverOutputName)}`,
         },
     };
-    (0, devkit_1.updateProjectConfiguration)(tree, appName, project);
-    const installTask = (0, devkit_1.addDependenciesToPackageJson)(tree, {
+    (0, devkit_2.updateProjectConfiguration)(tree, appName, project);
+    const installTask = (0, devkit_2.addDependenciesToPackageJson)(tree, {
         '@module-federation/node': versions_1.moduleFederationNodeVersion,
+        cors: versions_1.corsVersion,
+        isbot: versions_1.isbotVersion,
+        express: versions_1.expressVersion,
+        '@types/express': versions_1.typesExpressVersion,
     }, {});
     tasks.push(installTask);
-    return (0, devkit_1.runTasksInSerial)(...tasks);
+    return (0, devkit_2.runTasksInSerial)(...tasks);
 }