@nx/angular 0.0.0-pr-22179-271588f

package/src/generators/setup-mf/files/ts-webpack/tsconfig.lint.json__tmpl__

@@ -0,0 +1,12 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "target": "ES2020"
+  },
+  "include": [
+    "src/main.ts",
+    <% if(type === "remote") { %> "src/remote-entry/<% if(standalone) { %>entry.routes.ts", <% } else { %> entry.module.ts", <% } } %>
+    "webpack.config.ts",
+    "webpack.prod.config.ts"
+  ]
+}

package/src/generators/setup-mf/files/ts-webpack/webpack.config.ts__tmpl__

@@ -0,0 +1,4 @@
+import { withModuleFederation } from '@nx/angular/module-federation';
+import config from './module-federation.config';
+
+export default withModuleFederation(config);

package/src/generators/setup-mf/files/ts-webpack/webpack.prod.config.ts__tmpl__

@@ -0,0 +1,16 @@
+import { withModuleFederation } from '@nx/angular/module-federation';
+import config from './module-federation.config';
+
+export default withModuleFederation({
+  ...config,
+  /*
+   * Remote overrides for production.
+   * Each entry is a pair of a unique name and the URL where it is deployed.
+   *
+   * e.g.
+   * remotes: [
+   *   ['app1', 'https://app1.example.com'],
+   *   ['app2', 'https://app2.example.com'],
+   * ]
+   */
+});

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

@@ -0,0 +1,20 @@
+module.exports = {
+  name: '<%= name %>',<% if(type === 'host') { %>
+  /**
+   * To use a remote that does not exist in your current Nx Workspace
+   * You can use the tuple-syntax to define your remote
+   *
+   * remotes: [['my-external-remote', 'https://nx-angular-remote.netlify.app']]
+   *
+   * You _may_ need to add a `remotes.d.ts` file to your `src/` folder declaring the external remote for tsc, with the
+   * following content:
+   *
+   * declare module 'my-external-remote';
+   *
+   */
+  remotes: [<% remotes.forEach(function(remote) { %>'<%= remote.remoteName %>',<% }); %>]<% } %><% if(type === 'remote') { %>
+  exposes: {<% if(standalone) { %>
+    './Routes': '<%= projectRoot %>/src/app/remote-entry/entry.routes.ts',<% } else { %>
+    './Module': '<%= projectRoot %>/src/app/remote-entry/entry.module.ts',<% } %>
+  },<% } %>
+};

package/src/generators/setup-mf/files/webpack/webpack.config.js__tmpl__

@@ -0,0 +1,3 @@
+const { withModuleFederation } = require('@nx/angular/module-federation');
+const config = require('./module-federation.config');
+module.exports = withModuleFederation(config);

package/src/generators/setup-mf/files/webpack/webpack.prod.config.js__tmpl__

@@ -0,0 +1,15 @@
+const { withModuleFederation } = require('@nx/angular/module-federation');
+const config = require('./module-federation.config');
+module.exports = withModuleFederation({
+    ...config,
+    /*
+     * Remote overrides for production.
+     * Each entry is a pair of a unique name and the URL where it is deployed.
+     *
+     * e.g.
+     * remotes: [
+     *   ['app1', 'https://app1.example.com'],
+     *   ['app2', 'https://app2.example.com'],
+     * ]
+     */
+});

package/src/generators/setup-mf/lib/add-cypress-workaround.d.ts

@@ -0,0 +1,3 @@
+import type { Tree } from '@nx/devkit';
+import type { Schema } from '../schema';
+export declare function addCypressOnErrorWorkaround(tree: Tree, schema: Schema): void;

package/src/generators/setup-mf/lib/add-cypress-workaround.js

@@ -0,0 +1,52 @@
+"use strict";
+// This is a temporary workaround to prevent cypress erroring
+// as Angular attempt to figure out how to fix HMR when styles.js
+// is attached to the index.html with type=module
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.addCypressOnErrorWorkaround = void 0;
+const devkit_1 = require("@nx/devkit");
+function addCypressOnErrorWorkaround(tree, schema) {
+    if (!schema.e2eProjectName) {
+        return;
+    }
+    const e2eProjectName = schema.e2eProjectName;
+    let e2eProject;
+    try {
+        e2eProject = (0, devkit_1.readProjectConfiguration)(tree, e2eProjectName);
+    }
+    catch {
+        devkit_1.logger.warn((0, devkit_1.stripIndents) `Could not find an associated e2e project for ${schema.appName} with name ${e2eProjectName}.
+    If there is an associated e2e project for this application, and it uses Cypress, you will need to add a workaround to allow Cypress to test correctly.
+    An error will be thrown in the console when you serve the application, coming from styles.js. It is an error that can be safely ignored and will not reach production due to how production builds of Angular are created.
+    You can find how to implement that workaround here: https://docs.cypress.io/api/events/catalog-of-events#Uncaught-Exceptions
+    `);
+        return;
+    }
+    if (e2eProject.targets?.e2e?.executor !== '@nx/cypress:cypress') {
+        try {
+            // don't ensure package is installed, if it's not installed, we don't need to add the workaround
+            const { CYPRESS_CONFIG_FILE_NAME_PATTERN, } = require('@nx/cypress/src/utils/config');
+            if (!(0, devkit_1.glob)(tree, [`${e2eProject.root}/${CYPRESS_CONFIG_FILE_NAME_PATTERN}`])
+                .length) {
+                // Not a cypress e2e project, skip
+                return;
+            }
+        }
+        catch {
+            // assume cypress is not installed
+            return;
+        }
+    }
+    const commandToAdd = `Cypress.on('uncaught:exception', err => {
+    if (err.message.includes(\`Cannot use 'import.meta' outside a module\`)) {
+      return false;
+    }
+    return true;
+  });`;
+    const pathToCommandsFile = (0, devkit_1.joinPathFragments)(e2eProject.sourceRoot, 'support/e2e.ts');
+    const commandsContent = tree.exists(pathToCommandsFile)
+        ? tree.read(pathToCommandsFile, 'utf-8')
+        : '';
+    tree.write(pathToCommandsFile, `${commandsContent}\n${commandToAdd}`);
+}
+exports.addCypressOnErrorWorkaround = addCypressOnErrorWorkaround;

package/src/generators/setup-mf/lib/add-remote-entry.d.ts

@@ -0,0 +1,3 @@
+import type { Tree } from '@nx/devkit';
+import type { Schema } from '../schema';
+export declare function addRemoteEntry(tree: Tree, { appName, routing, prefix, standalone }: Schema, appRoot: string): void;

package/src/generators/setup-mf/lib/add-remote-entry.js

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.addRemoteEntry = void 0;
+const devkit_1 = require("@nx/devkit");
+const route_utils_1 = require("../../../utils/nx-devkit/route-utils");
+function addRemoteEntry(tree, { appName, routing, prefix, standalone }, appRoot) {
+    (0, devkit_1.generateFiles)(tree, standalone
+        ? (0, devkit_1.joinPathFragments)(__dirname, '../files/standalone-entry-component-files')
+        : (0, devkit_1.joinPathFragments)(__dirname, '../files/entry-module-files'), `${appRoot}/src/app/remote-entry`, {
+        tmpl: '',
+        appName,
+        routing,
+        prefix,
+    });
+    if (standalone && routing) {
+        (0, route_utils_1.addRoute)(tree, (0, devkit_1.joinPathFragments)(appRoot, 'src/app/app.routes.ts'), `{path: '', loadChildren: () => import('./remote-entry/entry.routes').then(m => m.remoteRoutes)}`);
+    }
+    else if (routing) {
+        (0, route_utils_1.addRoute)(tree, (0, devkit_1.joinPathFragments)(appRoot, 'src/app/app.routes.ts'), `{ path: '', loadChildren: () => import('./remote-entry/entry.module').then(m => m.RemoteEntryModule) }`);
+    }
+}
+exports.addRemoteEntry = addRemoteEntry;

package/src/generators/setup-mf/lib/add-remote-to-host.d.ts

@@ -0,0 +1,4 @@
+import { Tree } from '@nx/devkit';
+import type { Schema } from '../schema';
+export declare function checkIsCommaNeeded(mfRemoteText: string): boolean;
+export declare function addRemoteToHost(tree: Tree, options: Schema): void;

package/src/generators/setup-mf/lib/add-remote-to-host.js

@@ -0,0 +1,108 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.addRemoteToHost = exports.checkIsCommaNeeded = void 0;
+const devkit_1 = require("@nx/devkit");
+const js_1 = require("@nx/js");
+const route_utils_1 = require("../../../utils/nx-devkit/route-utils");
+const ensure_typescript_1 = require("@nx/js/src/utils/typescript/ensure-typescript");
+let tsModule;
+function checkIsCommaNeeded(mfRemoteText) {
+    const remoteText = mfRemoteText.replace(/\s+/g, '');
+    return !remoteText.endsWith(',]')
+        ? remoteText === '[]'
+            ? false
+            : true
+        : false;
+}
+exports.checkIsCommaNeeded = checkIsCommaNeeded;
+function addRemoteToHost(tree, options) {
+    if (options.host) {
+        const hostProject = (0, devkit_1.readProjectConfiguration)(tree, options.host);
+        const pathToMFManifest = (0, devkit_1.joinPathFragments)(hostProject.sourceRoot, 'assets/module-federation.manifest.json');
+        const hostFederationType = determineHostFederationType(tree, pathToMFManifest);
+        const isHostUsingTypescriptConfig = tree.exists((0, devkit_1.joinPathFragments)(hostProject.root, 'module-federation.config.ts'));
+        if (hostFederationType === 'static') {
+            addRemoteToStaticHost(tree, options, hostProject, isHostUsingTypescriptConfig);
+        }
+        else if (hostFederationType === 'dynamic') {
+            addRemoteToDynamicHost(tree, options, pathToMFManifest);
+        }
+        // const declarationFilePath = joinPathFragments(
+        //   hostProject.sourceRoot,
+        //   'remotes.d.ts'
+        // );
+        //
+        // const declarationFileContent =
+        //   (tree.exists(declarationFilePath)
+        //     ? tree.read(declarationFilePath, 'utf-8')
+        //     : '') +
+        //   `\ndeclare module '${options.appName}/${
+        //     options.standalone ? `Routes` : `Module`
+        //   }';`;
+        // tree.write(declarationFilePath, declarationFileContent);
+        addLazyLoadedRouteToHostAppModule(tree, options, hostFederationType);
+    }
+}
+exports.addRemoteToHost = addRemoteToHost;
+function determineHostFederationType(tree, pathToMfManifest) {
+    return tree.exists(pathToMfManifest) ? 'dynamic' : 'static';
+}
+function addRemoteToStaticHost(tree, options, hostProject, isHostUsingTypescrpt) {
+    const hostMFConfigPath = (0, devkit_1.joinPathFragments)(hostProject.root, isHostUsingTypescrpt
+        ? 'module-federation.config.ts'
+        : 'module-federation.config.js');
+    if (!hostMFConfigPath || !tree.exists(hostMFConfigPath)) {
+        throw new Error(`The selected host application, ${options.host}, does not contain a module-federation.config.{ts,js} or module-federation.manifest.json file. Are you sure it has been set up as a host application?`);
+    }
+    const hostMFConfig = tree.read(hostMFConfigPath, 'utf-8');
+    const { tsquery } = require('@phenomnomnominal/tsquery');
+    const webpackAst = tsquery.ast(hostMFConfig);
+    const mfRemotesNode = tsquery(webpackAst, 'Identifier[name=remotes] ~ ArrayLiteralExpression', { visitAllChildren: true })[0];
+    const endOfPropertiesPos = mfRemotesNode.getEnd() - 1;
+    const isCommaNeeded = checkIsCommaNeeded(mfRemotesNode.getText());
+    const updatedConfig = `${hostMFConfig.slice(0, endOfPropertiesPos)}${isCommaNeeded ? ',' : ''}'${options.appName}',${hostMFConfig.slice(endOfPropertiesPos)}`;
+    tree.write(hostMFConfigPath, updatedConfig);
+}
+function addRemoteToDynamicHost(tree, options, pathToMfManifest) {
+    (0, devkit_1.updateJson)(tree, pathToMfManifest, (manifest) => {
+        return {
+            ...manifest,
+            [options.appName]: `http://localhost:${options.port}`,
+        };
+    });
+}
+// TODO(colum): future work: allow dev to pass to path to routing module
+function addLazyLoadedRouteToHostAppModule(tree, options, hostFederationType) {
+    if (!tsModule) {
+        tsModule = (0, ensure_typescript_1.ensureTypescript)();
+    }
+    const hostAppConfig = (0, devkit_1.readProjectConfiguration)(tree, options.host);
+    const pathToHostRootRouting = `${hostAppConfig.sourceRoot}/app/app.routes.ts`;
+    if (!tree.exists(pathToHostRootRouting)) {
+        return;
+    }
+    const hostRootRoutingFile = tree.read(pathToHostRootRouting, 'utf-8');
+    let sourceFile = tsModule.createSourceFile(pathToHostRootRouting, hostRootRoutingFile, tsModule.ScriptTarget.Latest, true);
+    if (hostFederationType === 'dynamic') {
+        sourceFile = (0, js_1.insertImport)(tree, sourceFile, pathToHostRootRouting, 'loadRemoteModule', '@nx/angular/mf');
+    }
+    const routePathName = options.standalone ? 'Routes' : 'Module';
+    const exportedRemote = options.standalone
+        ? 'remoteRoutes'
+        : 'RemoteEntryModule';
+    const routeToAdd = hostFederationType === 'dynamic'
+        ? `loadRemoteModule('${options.appName}', './${routePathName}')`
+        : `import('${options.appName}/${routePathName}')`;
+    (0, route_utils_1.addRoute)(tree, pathToHostRootRouting, `{
+    path: '${options.appName}',
+    loadChildren: () => ${routeToAdd}.then(m => m.${exportedRemote})
+    }`);
+    const pathToAppComponentTemplate = (0, devkit_1.joinPathFragments)(hostAppConfig.sourceRoot, 'app/app.component.html');
+    const appComponent = tree.read(pathToAppComponentTemplate, 'utf-8');
+    if (appComponent.includes(`<ul class="remote-menu">`) &&
+        appComponent.includes('</ul>')) {
+        const indexOfClosingMenuTag = appComponent.indexOf('</ul>');
+        const newAppComponent = `${appComponent.slice(0, indexOfClosingMenuTag)}<li><a routerLink="${options.appName}">${(0, devkit_1.names)(options.appName).className}</a></li>\n${appComponent.slice(indexOfClosingMenuTag)}`;
+        tree.write(pathToAppComponentTemplate, newAppComponent);
+    }
+}

package/src/generators/setup-mf/lib/change-build-target.d.ts

@@ -0,0 +1,3 @@
+import type { Tree } from '@nx/devkit';
+import type { Schema } from '../schema';
+export declare function changeBuildTarget(host: Tree, options: Schema): void;

package/src/generators/setup-mf/lib/change-build-target.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.changeBuildTarget = void 0;
+const devkit_1 = require("@nx/devkit");
+function changeBuildTarget(host, options) {
+    const appConfig = (0, devkit_1.readProjectConfiguration)(host, options.appName);
+    const configExtName = options.typescriptConfiguration ? 'ts' : 'js';
+    appConfig.targets.build.executor = '@nx/angular:webpack-browser';
+    appConfig.targets.build.options = {
+        ...appConfig.targets.build.options,
+        customWebpackConfig: {
+            path: `${appConfig.root}/webpack.config.${configExtName}`,
+        },
+    };
+    appConfig.targets.build.configurations.production = {
+        ...appConfig.targets.build.configurations.production,
+        customWebpackConfig: {
+            path: `${appConfig.root}/webpack.prod.config.${configExtName}`,
+        },
+    };
+    (0, devkit_1.updateProjectConfiguration)(host, options.appName, appConfig);
+}
+exports.changeBuildTarget = changeBuildTarget;

package/src/generators/setup-mf/lib/fix-bootstrap.d.ts

@@ -0,0 +1,3 @@
+import type { Tree } from '@nx/devkit';
+import type { Schema } from '../schema';
+export declare function fixBootstrap(tree: Tree, appRoot: string, options: Schema): void;

package/src/generators/setup-mf/lib/fix-bootstrap.js

@@ -0,0 +1,33 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.fixBootstrap = void 0;
+const devkit_1 = require("@nx/devkit");
+function fixBootstrap(tree, appRoot, options) {
+    const mainFilePath = (0, devkit_1.joinPathFragments)(appRoot, 'src/main.ts');
+    const bootstrapCode = tree.read(mainFilePath, 'utf-8');
+    if (options.standalone && options.mfType === 'remote') {
+        tree.write(`${appRoot}/src/bootstrap.ts`, standaloneBootstrapCode());
+    }
+    else {
+        tree.write((0, devkit_1.joinPathFragments)(appRoot, 'src/bootstrap.ts'), bootstrapCode);
+    }
+    const bootstrapImportCode = `import('./bootstrap').catch(err => console.error(err))`;
+    const fetchMFManifestCode = `import { setRemoteDefinitions } from '@nx/angular/mf';
+
+fetch('/assets/module-federation.manifest.json')
+  .then((res) => res.json())
+  .then(definitions => setRemoteDefinitions(definitions))
+  .then(() => ${bootstrapImportCode});`;
+    tree.write(mainFilePath, options.mfType === 'host' && options.federationType === 'dynamic'
+        ? fetchMFManifestCode
+        : `${bootstrapImportCode};`);
+}
+exports.fixBootstrap = fixBootstrap;
+const standaloneBootstrapCode = () => `import { bootstrapApplication } from '@angular/platform-browser';
+import { appConfig } from './app/app.config';
+import { RemoteEntryComponent } from './app/remote-entry/entry.component';
+
+bootstrapApplication(RemoteEntryComponent, appConfig).catch((err) =>
+  console.error(err)
+);
+`;

package/src/generators/setup-mf/lib/generate-config.d.ts

@@ -0,0 +1,6 @@
+import type { Tree } from '@nx/devkit';
+import type { Schema } from '../schema';
+export declare function generateWebpackConfig(tree: Tree, options: Schema, appRoot: string, remotesWithPorts: {
+    remoteName: string;
+    port: number;
+}[]): void;

package/src/generators/setup-mf/lib/generate-config.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.generateWebpackConfig = void 0;
+const devkit_1 = require("@nx/devkit");
+function generateWebpackConfig(tree, options, appRoot, remotesWithPorts) {
+    if (tree.exists(`${appRoot}/module-federation.config.js`) ||
+        tree.exists(`${appRoot}/webpack.config.js`) ||
+        tree.exists(`${appRoot}/webpack.prod.config.js`) ||
+        tree.exists(`${appRoot}/module-federation.config.ts`) ||
+        tree.exists(`${appRoot}/webpack.config.ts`) ||
+        tree.exists(`${appRoot}/webpack.prod.config.ts`)) {
+        devkit_1.logger.warn(`NOTE: We encountered an existing webpack config for the app ${options.appName}. We have overwritten this file with the Module Federation Config.\n
+      If this was not the outcome you expected, you can discard the changes we have made, create a backup of your current webpack config, and run the command again.`);
+    }
+    const pathToWebpackTemplateFiles = options.typescriptConfiguration
+        ? 'ts-webpack'
+        : 'webpack';
+    (0, devkit_1.generateFiles)(tree, (0, devkit_1.joinPathFragments)(__dirname, `../files/${pathToWebpackTemplateFiles}`), appRoot, {
+        tmpl: '',
+        type: options.mfType,
+        name: options.appName,
+        remotes: remotesWithPorts ?? [],
+        projectRoot: appRoot,
+        standalone: options.standalone,
+    });
+    if (!options.setParserOptionsProject) {
+        tree.delete((0, devkit_1.joinPathFragments)(appRoot, 'tsconfig.lint.json'));
+    }
+}
+exports.generateWebpackConfig = generateWebpackConfig;

package/src/generators/setup-mf/lib/get-remotes-with-ports.d.ts

@@ -0,0 +1,6 @@
+import type { Tree } from '@nx/devkit';
+import type { Schema } from '../schema';
+export declare function getRemotesWithPorts(host: Tree, options: Schema): {
+    remoteName: string;
+    port: number;
+}[];

package/src/generators/setup-mf/lib/get-remotes-with-ports.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getRemotesWithPorts = void 0;
+const devkit_1 = require("@nx/devkit");
+function getRemotesWithPorts(host, options) {
+    // If type is host and remotes supplied, check remotes exist
+    const remotesWithPort = [];
+    if (options.mfType === 'host' &&
+        Array.isArray(options.remotes) &&
+        options.remotes.length > 0) {
+        for (const remote of options.remotes) {
+            const remoteConfig = (0, devkit_1.readProjectConfiguration)(host, remote);
+            remotesWithPort.push({
+                remoteName: remote,
+                port: remoteConfig.targets['serve']?.options?.port ?? 4200,
+            });
+        }
+    }
+    return remotesWithPort;
+}
+exports.getRemotesWithPorts = getRemotesWithPorts;

package/src/generators/setup-mf/lib/index.d.ts

@@ -0,0 +1,14 @@
+export * from './add-cypress-workaround';
+export * from './add-remote-entry';
+export * from './add-remote-to-host';
+export * from './change-build-target';
+export * from './fix-bootstrap';
+export * from './generate-config';
+export * from './get-remotes-with-ports';
+export * from './normalize-options';
+export * from './update-tsconfig';
+export * from './setup-host-if-dynamic';
+export * from './setup-serve-target';
+export * from './update-host-app-routes';
+export * from './remove-dead-code-from-remote';
+export * from './setup-tspath-for-remote';

package/src/generators/setup-mf/lib/index.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./add-cypress-workaround"), exports);
+tslib_1.__exportStar(require("./add-remote-entry"), exports);
+tslib_1.__exportStar(require("./add-remote-to-host"), exports);
+tslib_1.__exportStar(require("./change-build-target"), exports);
+tslib_1.__exportStar(require("./fix-bootstrap"), exports);
+tslib_1.__exportStar(require("./generate-config"), exports);
+tslib_1.__exportStar(require("./get-remotes-with-ports"), exports);
+tslib_1.__exportStar(require("./normalize-options"), exports);
+tslib_1.__exportStar(require("./update-tsconfig"), exports);
+tslib_1.__exportStar(require("./setup-host-if-dynamic"), exports);
+tslib_1.__exportStar(require("./setup-serve-target"), exports);
+tslib_1.__exportStar(require("./update-host-app-routes"), exports);
+tslib_1.__exportStar(require("./remove-dead-code-from-remote"), exports);
+tslib_1.__exportStar(require("./setup-tspath-for-remote"), exports);

package/src/generators/setup-mf/lib/normalize-options.d.ts

@@ -0,0 +1,3 @@
+import type { Tree } from '@nx/devkit';
+import type { NormalizedOptions, Schema } from '../schema';
+export declare function normalizeOptions(tree: Tree, options: Schema): NormalizedOptions;

package/src/generators/setup-mf/lib/normalize-options.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.normalizeOptions = void 0;
+const project_1 = require("../../utils/project");
+function normalizeOptions(tree, options) {
+    return {
+        ...options,
+        typescriptConfiguration: options.typescriptConfiguration ?? true,
+        federationType: options.federationType ?? 'static',
+        prefix: options.prefix ?? (0, project_1.getProjectPrefix)(tree, options.appName) ?? 'app',
+        standalone: options.standalone ?? true,
+    };
+}
+exports.normalizeOptions = normalizeOptions;

package/src/generators/setup-mf/lib/remove-dead-code-from-remote.d.ts

@@ -0,0 +1,3 @@
+import type { Tree } from '@nx/devkit';
+import { Schema } from '../schema';
+export declare function removeDeadCodeFromRemote(tree: Tree, options: Schema): void;

package/src/generators/setup-mf/lib/remove-dead-code-from-remote.js

@@ -0,0 +1,56 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.removeDeadCodeFromRemote = void 0;
+const devkit_1 = require("@nx/devkit");
+function removeDeadCodeFromRemote(tree, options) {
+    const projectName = options.appName;
+    const project = (0, devkit_1.readProjectConfiguration)(tree, projectName);
+    ['css', 'less', 'scss', 'sass'].forEach((style) => {
+        const pathToComponentStyle = (0, devkit_1.joinPathFragments)(project.sourceRoot, `app/app.component.${style}`);
+        if (tree.exists(pathToComponentStyle)) {
+            tree.delete(pathToComponentStyle);
+        }
+    });
+    tree.rename((0, devkit_1.joinPathFragments)(project.sourceRoot, 'app/nx-welcome.component.ts'), (0, devkit_1.joinPathFragments)(project.sourceRoot, 'app/remote-entry/nx-welcome.component.ts'));
+    tree.delete((0, devkit_1.joinPathFragments)(project.sourceRoot, 'app/app.component.spec.ts'));
+    tree.delete((0, devkit_1.joinPathFragments)(project.sourceRoot, 'app/app.component.html'));
+    const pathToAppComponent = (0, devkit_1.joinPathFragments)(project.sourceRoot, 'app/app.component.ts');
+    if (!options.standalone) {
+        const componentContents = tree.read(pathToAppComponent, 'utf-8');
+        const isInlineTemplate = !componentContents.includes('templateUrl');
+        const component = componentContents.split(isInlineTemplate ? 'template' : 'templateUrl')[0] +
+            `template: '<router-outlet></router-outlet>'
+
+})
+export class AppComponent {}`;
+        tree.write(pathToAppComponent, component);
+        tree.write((0, devkit_1.joinPathFragments)(project.sourceRoot, 'app/app.module.ts'), `import { NgModule } from '@angular/core';
+import { BrowserModule } from '@angular/platform-browser';
+import { RouterModule } from '@angular/router';
+import { AppComponent } from './app.component';
+
+@NgModule({
+  declarations: [AppComponent],
+  imports: [
+    BrowserModule,
+    RouterModule.forRoot([{
+      path: '',
+      loadChildren: () => import('./remote-entry/entry.module').then(m => m.RemoteEntryModule)
+    }], { initialNavigation: 'enabledBlocking' }),
+  ],
+  providers: [],
+  bootstrap: [AppComponent],
+})
+export class AppModule {}`);
+    }
+    else {
+        tree.delete(pathToAppComponent);
+        const pathToIndexHtml = project.targets.build.options.index;
+        const indexContents = tree.read(pathToIndexHtml, 'utf-8');
+        const rootSelectorRegex = new RegExp(`${options.prefix || 'app'}-root`, 'ig');
+        const remoteEntrySelector = `${options.prefix || 'app'}-${projectName}-entry`;
+        const newIndexContents = indexContents.replace(rootSelectorRegex, remoteEntrySelector);
+        tree.write(pathToIndexHtml, newIndexContents);
+    }
+}
+exports.removeDeadCodeFromRemote = removeDeadCodeFromRemote;

package/src/generators/setup-mf/lib/setup-host-if-dynamic.d.ts

@@ -0,0 +1,3 @@
+import type { Tree } from '@nx/devkit';
+import type { Schema } from '../schema';
+export declare function setupHostIfDynamic(tree: Tree, options: Schema): void;

package/src/generators/setup-mf/lib/setup-host-if-dynamic.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.setupHostIfDynamic = void 0;
+const devkit_1 = require("@nx/devkit");
+function setupHostIfDynamic(tree, options) {
+    if (options.federationType === 'static') {
+        return;
+    }
+    const project = (0, devkit_1.readProjectConfiguration)(tree, options.appName);
+    const pathToMFManifest = (0, devkit_1.joinPathFragments)(project.sourceRoot, 'assets/module-federation.manifest.json');
+    if (!tree.exists(pathToMFManifest)) {
+        tree.write(pathToMFManifest, '{}');
+    }
+    const pathToProdWebpackConfig = (0, devkit_1.joinPathFragments)(project.root, `webpack.prod.config.${options.typescriptConfiguration ? 'ts' : 'js'}`);
+    if (tree.exists(pathToProdWebpackConfig)) {
+        tree.delete(pathToProdWebpackConfig);
+    }
+    delete project.targets.build.configurations.production?.customWebpackConfig;
+    (0, devkit_1.updateProjectConfiguration)(tree, options.appName, project);
+}
+exports.setupHostIfDynamic = setupHostIfDynamic;

package/src/generators/setup-mf/lib/setup-serve-target.d.ts

@@ -0,0 +1,3 @@
+import type { Tree } from '@nx/devkit';
+import type { Schema } from '../schema';
+export declare function setupServeTarget(host: Tree, options: Schema): void;

package/src/generators/setup-mf/lib/setup-serve-target.js

@@ -0,0 +1,39 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.setupServeTarget = void 0;
+const devkit_1 = require("@nx/devkit");
+function setupServeTarget(host, options) {
+    const appConfig = (0, devkit_1.readProjectConfiguration)(host, options.appName);
+    appConfig.targets['serve'] = {
+        ...appConfig.targets['serve'],
+        executor: options.mfType === 'host'
+            ? '@nx/angular:module-federation-dev-server'
+            : '@nx/angular:dev-server',
+        options: {
+            ...appConfig.targets['serve'].options,
+            port: options.port ?? undefined,
+            publicHost: `http://localhost:${options.port ?? 4200}`,
+        },
+    };
+    if (options.mfType === 'remote') {
+        appConfig.targets['serve-static'] = {
+            executor: '@nx/web:file-server',
+            defaultConfiguration: 'production',
+            options: {
+                buildTarget: `${options.appName}:build`,
+                port: options.port,
+                watch: false,
+            },
+            configurations: {
+                development: {
+                    buildTarget: `${options.appName}:build:development`,
+                },
+                production: {
+                    buildTarget: `${options.appName}:build:production`,
+                },
+            },
+        };
+    }
+    (0, devkit_1.updateProjectConfiguration)(host, options.appName, appConfig);
+}
+exports.setupServeTarget = setupServeTarget;

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

@@ -0,0 +1,3 @@
+import type { Tree } from '@nx/devkit';
+import type { Schema } from '../schema';
+export declare function setupTspathForRemote(tree: Tree, options: Schema): void;

package/src/generators/setup-mf/lib/setup-tspath-for-remote.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.setupTspathForRemote = void 0;
+const devkit_1 = require("@nx/devkit");
+const js_1 = require("@nx/js");
+function setupTspathForRemote(tree, options) {
+    const project = (0, devkit_1.readProjectConfiguration)(tree, options.appName);
+    const exportPath = options.standalone
+        ? `./src/app/remote-entry/entry.routes.ts`
+        : `./src/app/remote-entry/entry.module.ts`;
+    const exportName = options.standalone ? 'Routes' : 'Module';
+    (0, js_1.addTsConfigPath)(tree, `${options.appName}/${exportName}`, [
+        (0, devkit_1.joinPathFragments)(project.root, exportPath),
+    ]);
+}
+exports.setupTspathForRemote = setupTspathForRemote;

package/src/generators/setup-mf/lib/update-host-app-routes.d.ts

@@ -0,0 +1,3 @@
+import { Tree } from 'nx/src/generators/tree';
+import { Schema } from '../schema';
+export declare function updateHostAppRoutes(tree: Tree, options: Schema): void;