@nx/angular 0.0.0-pr-27786-e5e2109 → 0.0.0-pr-27404-f7ba497

package/migrations.json

@@ -2122,6 +2122,19 @@
           "alwaysAddToPackageJson": false
         }
       }
+    },
+    "19.7.0": {
+      "version": "19.7.0-beta.0",
+      "packages": {
+        "@module-federation/enhanced": {
+          "version": "~0.6.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@module-federation/node": {
+          "version": "~2.5.0",
+          "alwaysAddToPackageJson": false
+        }
+      }
     }
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nx/angular",
-  "version": "0.0.0-pr-27786-e5e2109",
+  "version": "0.0.0-pr-27404-f7ba497",
   "private": false,
   "description": "The Nx Plugin for Angular contains executors, generators, and utilities for managing Angular applications and libraries within an Nx workspace. It provides: \n\n- Integration with libraries such as Storybook, Jest, ESLint, Tailwind CSS, Playwright and Cypress. \n\n- Generators to help scaffold code quickly (like: Micro Frontends, Libraries, both internal to your codebase and publishable to npm) \n\n- Single Component Application Modules (SCAMs) \n\n- NgRx helpers. \n\n- Utilities for automatic workspace refactoring.",
   "repository": {
@@ -69,7 +69,7 @@
   },
   "dependencies": {
     "@phenomnomnominal/tsquery": "~5.0.1",
-    "@typescript-eslint/type-utils": "^7.16.0",
+    "@typescript-eslint/type-utils": "^8.0.0",
     "chalk": "^4.1.0",
     "find-cache-dir": "^3.3.2",
     "magic-string": "~0.30.2",
@@ -78,15 +78,15 @@
     "tslib": "^2.3.0",
     "webpack-merge": "^5.8.0",
     "webpack": "^5.88.0",
-    "@module-federation/enhanced": "~0.2.3",
-    "@nx/devkit": "0.0.0-pr-27786-e5e2109",
-    "@nx/js": "0.0.0-pr-27786-e5e2109",
-    "@nx/eslint": "0.0.0-pr-27786-e5e2109",
-    "@nx/webpack": "0.0.0-pr-27786-e5e2109",
-    "@nx/web": "0.0.0-pr-27786-e5e2109",
-    "@nx/workspace": "0.0.0-pr-27786-e5e2109",
+    "@module-federation/enhanced": "~0.6.0",
+    "@nx/devkit": "0.0.0-pr-27404-f7ba497",
+    "@nx/js": "0.0.0-pr-27404-f7ba497",
+    "@nx/eslint": "0.0.0-pr-27404-f7ba497",
+    "@nx/webpack": "0.0.0-pr-27404-f7ba497",
+    "@nx/web": "0.0.0-pr-27404-f7ba497",
+    "@nx/workspace": "0.0.0-pr-27404-f7ba497",
     "piscina": "^4.4.0",
-    "@nrwl/angular": "0.0.0-pr-27786-e5e2109"
+    "@nrwl/angular": "0.0.0-pr-27404-f7ba497"
   },
   "peerDependencies": {
     "@angular-devkit/build-angular": ">= 16.0.0 < 19.0.0",

package/src/builders/webpack-server/webpack-server.impl.js

@@ -33,9 +33,7 @@ function buildServerAppWithCustomWebpackConfiguration(options, context, pathToWe
             // Therefore, if the build is an MF Server build, remove the auto-includes from
             // the base webpack config from Angular
             let mergedConfig = await (0, webpack_1.mergeCustomWebpackConfig)(baseWebpackConfig, pathToWebpackConfig, options, context.target);
-            if (mergedConfig.plugins
-                .map((p) => p.constructor.name)
-                .includes('UniversalFederationPlugin')) {
+            if (mergedConfig.target === 'async-node') {
                 mergedConfig.entry.main = mergedConfig.entry.main.filter((m) => !m.startsWith('@angular/platform-server/init'));
                 mergedConfig.module.rules = mergedConfig.module.rules.filter((m) => !m.loader
                     ? true

package/src/executors/module-federation-ssr-dev-server/lib/start-static-remotes.d.ts

@@ -1,9 +1,4 @@
 import { type ExecutorContext } from '@nx/devkit';
 import { type Schema } from '../schema';
 import type { StaticRemotesConfig } from '@nx/webpack/src/utils/module-federation/parse-static-remotes-config';
-export declare function startStaticRemotes(ssrStaticRemotesConfig: StaticRemotesConfig, context: ExecutorContext, options: Schema): AsyncGenerator<{
-    success: boolean;
-    baseUrl: string;
-}, {
-    success: boolean;
-}, unknown>;
+export declare function startStaticRemotes(ssrStaticRemotesConfig: StaticRemotesConfig, context: ExecutorContext, options: Schema): AsyncIterable<unknown>;

package/src/executors/module-federation-ssr-dev-server/lib/start-static-remotes.js

@@ -6,9 +6,13 @@ const devkit_1 = require("@nx/devkit");
 const file_server_impl_1 = tslib_1.__importDefault(require("@nx/web/src/executors/file-server/file-server.impl"));
 const path_1 = require("path");
 const fs_1 = require("fs");
+const async_iterable_1 = require("@nx/devkit/src/utils/async-iterable");
 function startStaticRemotes(ssrStaticRemotesConfig, context, options) {
     if (ssrStaticRemotesConfig.remotes.length === 0) {
-        return;
+        return (0, async_iterable_1.createAsyncIterable)(({ next, done }) => {
+            next({ success: true });
+            done();
+        });
     }
     // The directories are usually generated with /browser and /server suffixes so we need to copy them to a common directory
     const commonOutputDirectory = (0, path_1.join)(devkit_1.workspaceRoot, 'tmp/static-remotes');

package/src/executors/module-federation-ssr-dev-server/module-federation-ssr-dev-server.impl.d.ts

@@ -1,4 +1,4 @@
 import { type ExecutorContext } from '@nx/devkit';
 import type { Schema } from './schema';
-export declare function moduleFederationSsrDevServerExecutor(schema: Schema, context: ExecutorContext): AsyncGenerator<any, any, undefined>;
+export declare function moduleFederationSsrDevServerExecutor(schema: Schema, context: ExecutorContext): AsyncGenerator<unknown, any, undefined>;
 export default moduleFederationSsrDevServerExecutor;

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

@@ -74,7 +74,7 @@ async function* moduleFederationSsrDevServerExecutor(schema, context) {
         ...v,
         baseUrl: undefined,
     }));
-    return yield* (0, async_iterable_1.combineAsyncIterables)(removeBaseUrlEmission(currIter), ...devRemotes.map(removeBaseUrlEmission), ...(staticRemotes ? [removeBaseUrlEmission(staticRemotes)] : []), (0, async_iterable_1.createAsyncIterable)(async ({ next, done }) => {
+    const combined = (0, async_iterable_1.combineAsyncIterables)(removeBaseUrlEmission(staticRemotes), ...(devRemotes ? devRemotes.map(removeBaseUrlEmission) : []), (0, async_iterable_1.createAsyncIterable)(async ({ next, done }) => {
         if (!options.isInitialHost) {
             done();
             return;
@@ -94,6 +94,7 @@ async function* moduleFederationSsrDevServerExecutor(schema, context) {
                 retryDelay: 2500,
                 host: 'localhost',
             })));
+            next({ success: true, baseUrl: `http://localhost:${options.port}` });
         }
         catch (error) {
             throw new Error(`Failed to start remotes. Check above for any errors.`, {
@@ -104,5 +105,15 @@ async function* moduleFederationSsrDevServerExecutor(schema, context) {
             done();
         }
     }));
+    let refs = 2 + (devRemotes?.length ?? 0);
+    for await (const result of combined) {
+        if (result.success === false)
+            throw new Error('Remotes failed to start');
+        if (result.success)
+            refs--;
+        if (refs === 0)
+            break;
+    }
+    return yield* currIter;
 }
 exports.default = moduleFederationSsrDevServerExecutor;

package/src/generators/add-linting/add-linting.js

@@ -8,6 +8,7 @@ const global_eslint_config_1 = require("@nx/eslint/src/generators/init/global-es
 const eslint_file_1 = require("@nx/eslint/src/generators/utils/eslint-file");
 const add_angular_eslint_dependencies_1 = require("./lib/add-angular-eslint-dependencies");
 const buildable_project_1 = require("./lib/buildable-project");
+const flat_config_1 = require("@nx/eslint/src/utils/flat-config");
 async function addLintingGenerator(tree, options) {
     const tasks = [];
     const rootProject = options.projectRoot === '.' || options.projectRoot === '';
@@ -32,21 +33,10 @@ async function addLintingGenerator(tree, options) {
         const hasParserOptions = tree
             .read((0, devkit_1.joinPathFragments)(options.projectRoot, eslintFile), 'utf8')
             .includes(`${options.projectRoot}/tsconfig.*?.json`);
-        (0, eslint_file_1.replaceOverridesInLintConfig)(tree, options.projectRoot, [
-            ...(rootProject ? [global_eslint_config_1.typeScriptOverride, global_eslint_config_1.javaScriptOverride] : []),
-            {
-                files: ['*.ts'],
-                ...(hasParserOptions
-                    ? {
-                        parserOptions: {
-                            project: [`${options.projectRoot}/tsconfig.*?.json`],
-                        },
-                    }
-                    : {}),
-                extends: [
-                    'plugin:@nx/angular',
-                    'plugin:@angular-eslint/template/process-inline-templates',
-                ],
+        if ((0, flat_config_1.useFlatConfig)(tree)) {
+            (0, eslint_file_1.addPredefinedConfigToFlatLintConfig)(tree, options.projectRoot, 'flat/angular');
+            (0, eslint_file_1.addPredefinedConfigToFlatLintConfig)(tree, options.projectRoot, 'flat/angular-template');
+            (0, eslint_file_1.addOverrideToLintConfig)(tree, options.projectRoot, {
                 rules: {
                     '@angular-eslint/directive-selector': [
                         'error',
@@ -65,28 +55,86 @@ async function addLintingGenerator(tree, options) {
                         },
                     ],
                 },
-            },
-            {
-                files: ['*.html'],
-                extends: ['plugin:@nx/angular-template'],
-                /**
-                 * Having an empty rules object present makes it more obvious to the user where they would
-                 * extend things from if they needed to
-                 */
-                rules: {},
-            },
-            ...((0, buildable_project_1.isBuildableLibraryProject)(tree, options.projectName)
-                ? [
-                    {
-                        files: ['*.json'],
-                        parser: 'jsonc-eslint-parser',
-                        rules: {
-                            '@nx/dependency-checks': 'error',
-                        },
+            });
+            if ((0, buildable_project_1.isBuildableLibraryProject)(tree, options.projectName)) {
+                (0, eslint_file_1.addOverrideToLintConfig)(tree, '', {
+                    files: ['*.json'],
+                    parser: 'jsonc-eslint-parser',
+                    rules: {
+                        '@nx/dependency-checks': [
+                            'error',
+                            {
+                                // With flat configs, we don't want to include imports in the eslint js/cjs/mjs files to be checked
+                                ignoredFiles: ['**/*/*eslint*'],
+                            },
+                        ],
+                    },
+                });
+            }
+        }
+        else {
+            (0, eslint_file_1.replaceOverridesInLintConfig)(tree, options.projectRoot, [
+                ...(rootProject ? [global_eslint_config_1.typeScriptOverride, global_eslint_config_1.javaScriptOverride] : []),
+                {
+                    files: ['*.ts'],
+                    ...(hasParserOptions
+                        ? {
+                            parserOptions: {
+                                project: [`${options.projectRoot}/tsconfig.*?.json`],
+                            },
+                        }
+                        : {}),
+                    extends: [
+                        'plugin:@nx/angular',
+                        'plugin:@angular-eslint/template/process-inline-templates',
+                    ],
+                    rules: {
+                        '@angular-eslint/directive-selector': [
+                            'error',
+                            {
+                                type: 'attribute',
+                                prefix: (0, string_utils_1.camelize)(options.prefix),
+                                style: 'camelCase',
+                            },
+                        ],
+                        '@angular-eslint/component-selector': [
+                            'error',
+                            {
+                                type: 'element',
+                                prefix: (0, string_utils_1.dasherize)(options.prefix),
+                                style: 'kebab-case',
+                            },
+                        ],
                     },
-                ]
-                : []),
-        ]);
+                },
+                {
+                    files: ['*.html'],
+                    extends: ['plugin:@nx/angular-template'],
+                    /**
+                     * Having an empty rules object present makes it more obvious to the user where they would
+                     * extend things from if they needed to
+                     */
+                    rules: {},
+                },
+                ...((0, buildable_project_1.isBuildableLibraryProject)(tree, options.projectName)
+                    ? [
+                        {
+                            files: ['*.json'],
+                            parser: 'jsonc-eslint-parser',
+                            rules: {
+                                '@nx/dependency-checks': [
+                                    'error',
+                                    {
+                                        // With flat configs, we don't want to include imports in the eslint js/cjs/mjs files to be checked
+                                        ignoredFiles: ['**/*/*eslint*'],
+                                    },
+                                ],
+                            },
+                        },
+                    ]
+                    : []),
+            ]);
+        }
     }
     if (!options.skipPackageJson) {
         const installTask = (0, add_angular_eslint_dependencies_1.addAngularEsLintDependencies)(tree, options.projectName);

package/src/generators/add-linting/lib/add-angular-eslint-dependencies.js

@@ -4,14 +4,19 @@ exports.addAngularEsLintDependencies = addAngularEsLintDependencies;
 const devkit_1 = require("@nx/devkit");
 const version_utils_1 = require("../../utils/version-utils");
 const buildable_project_1 = require("./buildable-project");
+const flat_config_1 = require("@nx/eslint/src/utils/flat-config");
 function addAngularEsLintDependencies(tree, projectName) {
     const compatVersions = (0, version_utils_1.versions)(tree);
     const angularEslintVersionToInstall = compatVersions.angularEslintVersion;
-    const devDependencies = {
-        '@angular-eslint/eslint-plugin': angularEslintVersionToInstall,
-        '@angular-eslint/eslint-plugin-template': angularEslintVersionToInstall,
-        '@angular-eslint/template-parser': angularEslintVersionToInstall,
-    };
+    const devDependencies = (0, flat_config_1.useFlatConfig)(tree)
+        ? {
+            'angular-eslint': angularEslintVersionToInstall,
+        }
+        : {
+            '@angular-eslint/eslint-plugin': angularEslintVersionToInstall,
+            '@angular-eslint/eslint-plugin-template': angularEslintVersionToInstall,
+            '@angular-eslint/template-parser': angularEslintVersionToInstall,
+        };
     if ('typescriptEslintVersion' in compatVersions) {
         devDependencies['@typescript-eslint/utils'] =
             compatVersions.typescriptEslintVersion;

package/src/generators/utils/add-mf-env-to-inputs.js

@@ -22,6 +22,7 @@ function addMfEnvToTargetDefaultInputs(tree) {
     }
     if (!mfEnvVarExists) {
         nxJson.targetDefaults[webpackExecutor].inputs.push({ env: mfEnvVar });
-        (0, devkit_1.updateNxJson)(tree, nxJson);
     }
+    nxJson.targetDefaults[webpackExecutor].cache = true;
+    (0, devkit_1.updateNxJson)(tree, nxJson);
 }

package/src/utils/mf/with-module-federation-ssr.js

@@ -12,7 +12,7 @@ async function withModuleFederationForSSR(options, configOverride) {
     return (config) => {
         const updatedConfig = {
             ...(config ?? {}),
-            target: false,
+            target: 'async-node',
             output: {
                 ...(config.output ?? {}),
                 uniqueName: options.name,
@@ -30,7 +30,7 @@ async function withModuleFederationForSSR(options, configOverride) {
             },
             plugins: [
                 ...(config.plugins ?? []),
-                new (require('@module-federation/node').UniversalFederationPlugin)({
+                new (require('@module-federation/enhanced').ModuleFederationPlugin)({
                     name: options.name,
                     filename: 'remoteEntry.js',
                     exposes: options.exposes,
@@ -38,10 +38,6 @@ async function withModuleFederationForSSR(options, configOverride) {
                     shared: {
                         ...sharedDependencies,
                     },
-                    library: {
-                        type: 'commonjs-module',
-                    },
-                    isServer: true,
                     /**
                      * Apply user-defined config override
                      */
@@ -50,9 +46,14 @@ async function withModuleFederationForSSR(options, configOverride) {
                         !options.disableNxRuntimeLibraryControlPlugin
                         ? [
                             ...(configOverride?.runtimePlugins ?? []),
+                            require.resolve('@module-federation/node/runtimePlugin'),
                             require.resolve('@nx/webpack/src/utils/module-federation/plugins/runtime-library-control.plugin.js'),
                         ]
-                        : configOverride?.runtimePlugins,
+                        : [
+                            ...(configOverride?.runtimePlugins ?? []),
+                            require.resolve('@module-federation/node/runtimePlugin'),
+                        ],
+                    virtualRuntimeEntry: true,
                 }, {}),
                 sharedLibraries.getReplacementPlugin(),
             ],

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

@@ -55,6 +55,7 @@ async function withModuleFederation(options, configOverride) {
                             require.resolve('@nx/webpack/src/utils/module-federation/plugins/runtime-library-control.plugin.js'),
                         ]
                         : configOverride?.runtimePlugins,
+                    virtualRuntimeEntry: true,
                 }),
                 sharedLibraries.getReplacementPlugin(),
             ],

package/src/utils/versions.d.ts

@@ -12,9 +12,9 @@ export declare const typesCorsVersion = "~2.8.5";
 export declare const expressVersion = "~4.18.2";
 export declare const typesExpressVersion = "4.17.14";
 export declare const browserSyncVersion = "^3.0.0";
-export declare const moduleFederationNodeVersion = "~2.4.0";
-export declare const moduleFederationEnhancedVersion = "~0.2.3";
-export declare const angularEslintVersion = "^18.0.1";
+export declare const moduleFederationNodeVersion = "~2.5.0";
+export declare const moduleFederationEnhancedVersion = "~0.6.0";
+export declare const angularEslintVersion = "^18.3.0";
 export declare const typescriptEslintVersion = "^7.16.0";
 export declare const tailwindVersion = "^3.0.2";
 export declare const postcssVersion = "^8.4.5";

package/src/utils/versions.js

@@ -15,9 +15,9 @@ exports.typesCorsVersion = '~2.8.5';
 exports.expressVersion = '~4.18.2';
 exports.typesExpressVersion = '4.17.14';
 exports.browserSyncVersion = '^3.0.0';
-exports.moduleFederationNodeVersion = '~2.4.0';
-exports.moduleFederationEnhancedVersion = '~0.2.3';
-exports.angularEslintVersion = '^18.0.1';
+exports.moduleFederationNodeVersion = '~2.5.0';
+exports.moduleFederationEnhancedVersion = '~0.6.0';
+exports.angularEslintVersion = '^18.3.0';
 exports.typescriptEslintVersion = '^7.16.0';
 exports.tailwindVersion = '^3.0.2';
 exports.postcssVersion = '^8.4.5';