@nx/angular 21.1.2 → 21.2.0-beta.1

package/src/generators/library/library.js

@@ -3,28 +3,27 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.libraryGenerator = libraryGenerator;
 const tslib_1 = require("tslib");
 const devkit_1 = require("@nx/devkit");
+const log_show_project_command_1 = require("@nx/devkit/src/utils/log-show-project-command");
 const js_1 = require("@nx/js");
+const add_release_config_1 = require("@nx/js/src/generators/library/utils/add-release-config");
+const ts_solution_setup_1 = require("@nx/js/src/utils/typescript/ts-solution-setup");
 const init_1 = tslib_1.__importDefault(require("../../generators/init/init"));
+const test_runners_1 = require("../../utils/test-runners");
 const add_linting_1 = tslib_1.__importDefault(require("../add-linting/add-linting"));
 const setup_tailwind_1 = tslib_1.__importDefault(require("../setup-tailwind/setup-tailwind"));
-const version_utils_1 = require("../utils/version-utils");
+const add_jest_1 = require("../utils/add-jest");
+const add_vitest_1 = require("../utils/add-vitest");
 const dependencies_1 = require("../utils/dependencies");
+const ensure_angular_dependencies_1 = require("../utils/ensure-angular-dependencies");
+const version_utils_1 = require("../utils/version-utils");
 const add_module_1 = require("./lib/add-module");
+const add_project_1 = require("./lib/add-project");
 const add_standalone_component_1 = require("./lib/add-standalone-component");
-const enable_strict_type_checking_1 = require("./lib/enable-strict-type-checking");
-const normalize_options_1 = require("./lib/normalize-options");
-const update_lib_package_npm_scope_1 = require("./lib/update-lib-package-npm-scope");
-const update_tsconfig_1 = require("./lib/update-tsconfig");
 const create_files_1 = require("./lib/create-files");
-const add_project_1 = require("./lib/add-project");
-const add_jest_1 = require("../utils/add-jest");
+const normalize_options_1 = require("./lib/normalize-options");
 const set_generator_defaults_1 = require("./lib/set-generator-defaults");
-const ensure_angular_dependencies_1 = require("../utils/ensure-angular-dependencies");
-const log_show_project_command_1 = require("@nx/devkit/src/utils/log-show-project-command");
-const test_runners_1 = require("../../utils/test-runners");
-const add_vitest_1 = require("../utils/add-vitest");
-const ts_solution_setup_1 = require("@nx/js/src/utils/typescript/ts-solution-setup");
-const add_release_config_1 = require("@nx/js/src/generators/library/utils/add-release-config");
+const update_lib_package_npm_scope_1 = require("./lib/update-lib-package-npm-scope");
+const update_tsconfig_files_1 = require("./lib/update-tsconfig-files");
 async function libraryGenerator(tree, schema) {
     (0, ts_solution_setup_1.assertNotUsingTsSolutionSetup)(tree, 'angular', 'library');
     // Do some validation checks
@@ -51,7 +50,7 @@ async function libraryGenerator(tree, schema) {
     }
     const project = await (0, add_project_1.addProject)(tree, libraryOptions);
     (0, create_files_1.createFiles)(tree, options, project);
-    (0, update_tsconfig_1.updateTsConfig)(tree, libraryOptions);
+    (0, update_tsconfig_files_1.updateTsConfigFiles)(tree, libraryOptions);
     await addUnitTestRunner(tree, libraryOptions);
     updateNpmScopeIfBuildableOrPublishable(tree, libraryOptions);
     (0, set_generator_defaults_1.setGeneratorDefaults)(tree, options);
@@ -61,7 +60,6 @@ async function libraryGenerator(tree, schema) {
     else {
         await (0, add_standalone_component_1.addStandaloneComponent)(tree, options);
     }
-    setStrictMode(tree, libraryOptions);
     await addLinting(tree, libraryOptions);
     if (libraryOptions.addTailwind) {
         await (0, setup_tailwind_1.default)(tree, {
@@ -76,20 +74,16 @@ async function libraryGenerator(tree, schema) {
             'ng-packagr': pkgVersions.ngPackagrVersion,
         }, undefined, true);
         (0, dependencies_1.addBuildableLibrariesPostCssDependencies)(tree);
-        if (libraryOptions.publishable) {
-            await (0, add_release_config_1.releaseTasks)(tree);
-        }
     }
-    (0, js_1.addTsConfigPath)(tree, libraryOptions.importPath, [
-        (0, devkit_1.joinPathFragments)(libraryOptions.projectRoot, './src', 'index.ts'),
-    ]);
     if (!libraryOptions.skipFormat) {
         await (0, devkit_1.formatFiles)(tree);
     }
-    return () => {
-        (0, devkit_1.installPackagesTask)(tree);
-        (0, log_show_project_command_1.logShowProjectCommand)(libraryOptions.name);
-    };
+    const tasks = [() => (0, devkit_1.installPackagesTask)(tree)];
+    if (libraryOptions.publishable) {
+        tasks.push(await (0, add_release_config_1.releaseTasks)(tree));
+    }
+    tasks.push(() => (0, log_show_project_command_1.logShowProjectCommand)(libraryOptions.name));
+    return (0, devkit_1.runTasksInSerial)(...tasks);
 }
 async function addUnitTestRunner(host, options) {
     switch (options.unitTestRunner) {
@@ -116,14 +110,6 @@ function updateNpmScopeIfBuildableOrPublishable(host, options) {
         (0, update_lib_package_npm_scope_1.updateLibPackageNpmScope)(host, options);
     }
 }
-function setStrictMode(host, options) {
-    if (options.strict) {
-        (0, enable_strict_type_checking_1.enableStrictTypeChecking)(host, options);
-    }
-    else {
-        (0, enable_strict_type_checking_1.setLibraryStrictDefault)(host, options.strict);
-    }
-}
 async function addLinting(host, options) {
     if (options.linter === 'none') {
         return;

package/src/generators/library-secondary-entry-point/files/src/index.ts__tmpl__

@@ -1 +1 @@
-<% if (!skipModule) { %>export * from './lib/<%= fileName %>.module';<% } else { %>export const greeting = 'Hello World!';<% } %>
+<% if (!skipModule) { %>export * from './lib/<%= fileName %><%= moduleTypeSeparator %>module';<% } else { %>export const greeting = 'Hello World!';<% } %>

package/src/generators/library-secondary-entry-point/lib/add-files.js

@@ -7,9 +7,10 @@ function addFiles(tree, options) {
     (0, devkit_1.generateFiles)(tree, (0, devkit_1.joinPathFragments)(__dirname, '..', 'files'), options.entryPointDestination, {
         ...options,
         ...nameVariants,
+        moduleTypeSeparator: options.moduleTypeSeparator,
         tmpl: '',
     });
     if (options.skipModule) {
-        tree.delete((0, devkit_1.joinPathFragments)(options.entryPointDestination, `src/lib/${nameVariants.fileName}.module.ts`));
+        tree.delete((0, devkit_1.joinPathFragments)(options.entryPointDestination, `src/lib/${nameVariants.fileName}${options.moduleTypeSeparator}module.ts`));
     }
 }

package/src/generators/library-secondary-entry-point/lib/normalize-options.d.ts

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

package/src/generators/library-secondary-entry-point/lib/normalize-options.js

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.normalizeOptions = normalizeOptions;
 const devkit_1 = require("@nx/devkit");
+const artifact_types_1 = require("../../utils/artifact-types");
 function normalizeOptions(tree, options) {
     const name = (0, devkit_1.names)(options.name).fileName;
     const projects = (0, devkit_1.getProjects)(tree);
@@ -18,6 +19,7 @@ function normalizeOptions(tree, options) {
     }
     const { name: mainEntryPoint } = (0, devkit_1.readJson)(tree, (0, devkit_1.joinPathFragments)(libraryProject.root, 'package.json'));
     const secondaryEntryPoint = `${mainEntryPoint}/${options.name}`;
+    const moduleTypeSeparator = (0, artifact_types_1.getModuleTypeSeparator)(tree);
     return {
         ...options,
         entryPointDestination,
@@ -26,5 +28,6 @@ function normalizeOptions(tree, options) {
         libraryProject,
         secondaryEntryPoint,
         skipModule: options.skipModule ?? false,
+        moduleTypeSeparator,
     };
 }

package/src/generators/library-secondary-entry-point/schema.d.ts

@@ -13,4 +13,5 @@ export interface NormalizedGeneratorOptions extends GeneratorOptions {
   mainEntryPoint: string;
   secondaryEntryPoint: string;
   skipModule: boolean;
+  moduleTypeSeparator: '-' | '.';
 }

package/src/generators/move/lib/update-module-name.js

@@ -28,12 +28,19 @@ function updateModuleName(tree, { oldProjectName, newProjectName }) {
         to: `${(0, devkit_1.names)(unscopedNewProjectName).className}Module`,
     };
     const findModuleName = new RegExp(`\\b${moduleName.from}`, 'g');
-    const moduleFile = {
-        from: `${oldProjectName}.module`,
-        to: `${unscopedNewProjectName}.module`,
-    };
-    const findFileName = new RegExp(`\\b${moduleFile.from}`, 'g');
-    const filesToRename = [
+    const moduleFiles = [
+        {
+            from: `${oldProjectName}.module`,
+            fromRegex: new RegExp(`\\b${oldProjectName}\\.module`, 'g'),
+            to: `${unscopedNewProjectName}.module`,
+        },
+        {
+            from: `${oldProjectName}-module`,
+            fromRegex: new RegExp(`\\b${oldProjectName}-module`, 'g'),
+            to: `${unscopedNewProjectName}-module`,
+        },
+    ];
+    const filesToRename = moduleFiles.flatMap((moduleFile) => [
         {
             from: `${project.sourceRoot}/lib/${moduleFile.from}.ts`,
             to: `${project.sourceRoot}/lib/${moduleFile.to}.ts`,
@@ -42,15 +49,15 @@ function updateModuleName(tree, { oldProjectName, newProjectName }) {
             from: `${project.sourceRoot}/lib/${moduleFile.from}.spec.ts`,
             to: `${project.sourceRoot}/lib/${moduleFile.to}.spec.ts`,
         },
-    ].filter((rename) => rename.from !== rename.to);
+    ].filter((rename) => rename.from !== rename.to));
     if (filesToRename.length === 0) {
         return;
     }
     const replacements = [
-        {
-            regex: findFileName,
+        ...moduleFiles.map((moduleFile) => ({
+            regex: moduleFile.fromRegex,
             replaceWith: moduleFile.to,
-        },
+        })),
         {
             regex: findModuleName,
             replaceWith: moduleName.to,

package/src/generators/move/lib/update-secondary-entry-points.js

@@ -8,9 +8,6 @@ const libraryExecutors = [
     '@angular/build:ng-packagr',
     '@nx/angular:ng-packagr-lite',
     '@nx/angular:package',
-    // TODO(v17): remove when @nrwl/* scope is removed
-    '@nrwl/angular:ng-packagr-lite',
-    '@nrwl/angular:package',
 ];
 function updateSecondaryEntryPoints(tree, schema) {
     if (schema.oldProjectName === schema.newProjectName) {

package/src/generators/ng-add/migrators/builders/angular-devkit-karma.migrator.js

@@ -7,7 +7,7 @@ const path_1 = require("path");
 const builder_migrator_1 = require("./builder.migrator");
 class AngularDevkitKarmaMigrator extends builder_migrator_1.BuilderMigrator {
     constructor(tree, project, projectConfig, logger) {
-        super(tree, ['@angular-devkit/build-angular:karma'], 'karma', project, projectConfig, logger);
+        super(tree, ['@angular/build:karma', '@angular-devkit/build-angular:karma'], 'karma', project, projectConfig, logger);
     }
     migrate() {
         if (this.skipMigration) {

package/src/generators/ng-add/migrators/projects/app.migrator.js

@@ -11,6 +11,7 @@ const project_migrator_1 = require("./project.migrator");
 const supportedTargets = {
     build: {
         builders: [
+            '@angular/build:application',
             '@angular-devkit/build-angular:application',
             '@angular-devkit/build-angular:browser',
             '@angular-devkit/build-angular:browser-esbuild',
@@ -23,14 +24,24 @@ const supportedTargets = {
             '@cypress/schematic:cypress',
         ],
     },
-    i18n: { builders: ['@angular-devkit/build-angular:extract-i18n'] },
+    i18n: {
+        builders: [
+            '@angular/build:extract-i18n',
+            '@angular-devkit/build-angular:extract-i18n',
+        ],
+    },
     prerender: {
         builders: [
             '@nguniversal/builders:prerender',
             '@angular-devkit/build-angular:prerender',
         ],
     },
-    serve: { builders: ['@angular-devkit/build-angular:dev-server'] },
+    serve: {
+        builders: [
+            '@angular/build:dev-server',
+            '@angular-devkit/build-angular:dev-server',
+        ],
+    },
     server: { builders: ['@angular-devkit/build-angular:server'] },
     serveSsr: {
         builders: [
@@ -137,10 +148,34 @@ class AppMigrator extends project_migrator_1.ProjectMigrator {
         this.updateTsConfigFileUsedByBuildTarget(rootTsConfigFile, projectOffsetFromRoot);
         this.updateTsConfigFileUsedByServerTarget(projectOffsetFromRoot);
     }
-    convertBuildOptions(buildOptions) {
-        buildOptions.outputPath =
-            buildOptions.outputPath &&
-                (0, devkit_1.joinPathFragments)('dist', this.project.newRoot, this.targetNames.server ? 'browser' : '');
+    convertBuildOptions(buildOptions, target, updateOutputs = true) {
+        const { executor } = target;
+        const isApplicationBuilder = executor === '@angular/build:application' ||
+            executor === '@angular-devkit/build-angular:application';
+        if (updateOutputs) {
+            if (buildOptions.outputPath) {
+                if (isApplicationBuilder) {
+                    if (typeof buildOptions.outputPath === 'string') {
+                        buildOptions.outputPath = (0, devkit_1.joinPathFragments)('dist', this.project.newRoot);
+                    }
+                    else if (buildOptions.outputPath.base) {
+                        buildOptions.outputPath.base = (0, devkit_1.joinPathFragments)('dist', this.project.newRoot);
+                    }
+                }
+                else {
+                    buildOptions.outputPath = (0, devkit_1.joinPathFragments)('dist', this.project.newRoot, this.targetNames.server ? 'browser' : '');
+                }
+            }
+            else if (isApplicationBuilder) {
+                buildOptions.outputPath = (0, devkit_1.joinPathFragments)('dist', this.projectName);
+            }
+            if (typeof buildOptions.outputPath === 'string') {
+                target.outputs = ['{options.outputPath}'];
+            }
+            else if (buildOptions.outputPath?.base) {
+                target.outputs = ['{options.outputPath.base}'];
+            }
+        }
         if (buildOptions.index) {
             if (typeof buildOptions.index === 'string') {
                 buildOptions.index = this.convertAsset(buildOptions.index);
@@ -237,8 +272,8 @@ class AppMigrator extends project_migrator_1.ProjectMigrator {
                 this.logger.warn(`The tsConfig file "${buildDevTsConfig}" specified in the "${this.targetNames.build}" target could not be found. Skipping updating the tsConfig file.`);
             }
         }
-        this.convertBuildOptions(buildTarget.options ?? {});
-        Object.values(buildTarget.configurations ?? {}).forEach((config) => this.convertBuildOptions(config));
+        this.convertBuildOptions(buildTarget.options ?? {}, buildTarget);
+        Object.values(buildTarget.configurations ?? {}).forEach((config) => this.convertBuildOptions(config, buildTarget, false));
     }
     updatePrerenderTargetConfiguration() {
         if (!this.targetNames.prerender ||

package/src/generators/ngrx/schema.json

@@ -8,11 +8,11 @@
   "type": "object",
   "examples": [
     {
-      "command": "nx g @nx/angular:ngrx --root --parent=apps/my-app/src/app/app.module.ts --facade=false placeholder",
+      "command": "nx g @nx/angular:ngrx --root --parent=apps/my-app/src/app/app-module.ts --facade=false placeholder",
       "description": "Add root ngrx configration to the `my-app` application"
     },
     {
-      "command": "nx g @nx/angular:ngrx --parent=libs/my-lib/src/lib/my-lib.module.ts --facade=true --root=false users",
+      "command": "nx g @nx/angular:ngrx --parent=libs/my-lib/src/lib/my-lib-module.ts --facade=true --root=false users",
       "description": "Add a `users` state with a facade to the `my-lib` library. It will be tracked under the default `+state` folder in the lib"
     },
     {
@@ -42,7 +42,7 @@
     },
     "parent": {
       "type": "string",
-      "description": "The path to the file where the state will be registered. For NgModule usage, this will be your `app.module.ts` for your root state, or your Feature Module for feature state. For Standalone API usage, this will be your `app.config.ts` file for your root state, or the Routes definition file for your feature state. The host directory will create/use the new state directory.",
+      "description": "The path to the file where the state will be registered. For NgModule usage, this will be your `app-module.ts` for your root state, or your Feature Module for feature state. For Standalone API usage, this will be your `app.config.ts` file for your root state, or the Routes definition file for your feature state. The host directory will create/use the new state directory.",
       "x-prompt": "What is the path to the module or Routes definition where this NgRx state should be registered?",
       "x-priority": "important"
     },

package/src/generators/ngrx-root-store/lib/normalize-options.js

@@ -16,7 +16,11 @@ function normalizeOptions(tree, options) {
     const project = (0, devkit_1.readProjectConfiguration)(tree, options.project);
     const isStandalone = (0, ast_utils_1.isNgStandaloneApp)(tree, options.project);
     const appConfigPath = (0, devkit_1.joinPathFragments)(project.sourceRoot, 'app/app.config.ts');
-    const appMainPath = project.targets.build.options.main ?? project.targets.build.options.browser;
+    let appMainPath = project.targets.build.options.main ?? project.targets.build.options.browser;
+    if (!appMainPath) {
+        const sourceRoot = project.sourceRoot ?? (0, devkit_1.joinPathFragments)(project.root, 'src');
+        appMainPath = (0, devkit_1.joinPathFragments)(sourceRoot, 'main.ts');
+    }
     /** If NgModule App
      * -> Use App Module
      * If Standalone
@@ -24,7 +28,10 @@ function normalizeOptions(tree, options) {
      * --> If so, use that
      * --> If not, use main.ts
      */
-    const ngModulePath = (0, devkit_1.joinPathFragments)(project.sourceRoot, 'app/app.module.ts');
+    let ngModulePath = (0, devkit_1.joinPathFragments)(project.sourceRoot, 'app/app.module.ts');
+    if (!tree.exists(ngModulePath)) {
+        ngModulePath = (0, devkit_1.joinPathFragments)(project.sourceRoot, 'app/app-module.ts');
+    }
     const parent = !isStandalone && tree.exists(ngModulePath)
         ? ngModulePath
         : tree.exists(appConfigPath)

package/src/generators/pipe/lib/normalize-options.js

@@ -4,11 +4,15 @@ exports.normalizeOptions = normalizeOptions;
 const devkit_1 = require("@nx/devkit");
 const artifact_name_and_directory_utils_1 = require("@nx/devkit/src/generators/artifact-name-and-directory-utils");
 const validations_1 = require("../../utils/validations");
+const version_utils_1 = require("../../utils/version-utils");
 async function normalizeOptions(tree, options) {
+    const { major: angularMajorVersion } = (0, version_utils_1.getInstalledAngularVersionInfo)(tree);
+    options.typeSeparator ??= angularMajorVersion < 20 ? '.' : '-';
     const { artifactName: name, directory, fileName, filePath, project: projectName, } = await (0, artifact_name_and_directory_utils_1.determineArtifactNameAndDirectoryOptions)(tree, {
         name: options.name,
         path: options.path,
         suffix: 'pipe',
+        suffixSeparator: options.typeSeparator,
         allowedFileExtensions: ['ts'],
         fileExtension: 'ts',
     });

package/src/generators/pipe/pipe.js

@@ -14,7 +14,7 @@ async function pipeGenerator(tree, rawOptions) {
         fileName: options.fileName,
         selector: pipeNames.propertyName,
         standalone: options.standalone,
-        // Angular v19 or higher defaults to true, while v18 or lower defaults to false
+        // Angular v19 or higher defaults to true, while lower versions default to false
         setStandalone: (angularMajorVersion >= 19 && !options.standalone) ||
             (angularMajorVersion < 19 && options.standalone),
         tpl: '',

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

@@ -6,6 +6,7 @@ export interface Schema {
   standalone?: boolean;
   module?: string;
   export?: boolean;
+  typeSeparator?: string;
   skipFormat?: boolean;
 }
 

package/src/generators/pipe/schema.json

@@ -12,11 +12,15 @@
       "command": "nx g @nx/angular:pipe mylib/src/lib/foo.pipe.ts"
     },
     {
-      "description": "Generate a pipe without providing the file extension. It results in the pipe `FooPipe` at `mylib/src/lib/foo.pipe.ts`",
+      "description": "Generate a pipe without providing the file extension. It results in the pipe `FooPipe` at `mylib/src/lib/foo-pipe.ts`",
       "command": "nx g @nx/angular:pipe mylib/src/lib/foo"
     },
     {
-      "description": "Generate a pipe with the exported symbol different from the file name. It results in the pipe `CustomPipe` at `mylib/src/lib/foo.pipe.ts`",
+      "description": "Generate a pipe with a different type separator. It results in the pipe `FooPipe` at `mylib/src/lib/foo.pipe.ts`",
+      "command": "nx g @nx/angular:pipe mylib/src/lib/foo --typeSeparator=."
+    },
+    {
+      "description": "Generate a pipe with the exported symbol different from the file name. It results in the pipe `CustomPipe` at `mylib/src/lib/foo-pipe.ts`",
       "command": "nx g @nx/angular:pipe mylib/src/lib/foo --name=custom"
     }
   ],
@@ -59,6 +63,11 @@
       "default": false,
       "description": "The declaring NgModule exports this pipe."
     },
+    "typeSeparator": {
+      "type": "string",
+      "enum": ["-", "."],
+      "description": "The separator character to use before the type within the generated file's name. For example, if you set the option to `.`, the file will be named `example.pipe.ts`. It defaults to '-' for Angular v20+. For versions below v20, it defaults to '.'."
+    },
     "skipFormat": {
       "type": "boolean",
       "default": false,

package/src/generators/remote/files/standalone/src/bootstrap.server.ts__tmpl__

@@ -1,7 +1,7 @@
-import {bootstrapApplication} from '@angular/platform-browser';
-import {RemoteEntryComponent} from './app/remote-entry/entry.component';
-import {config} from './app/app.config.server';
+import { bootstrapApplication } from '@angular/platform-browser';
+import { RemoteEntry<%= componentType %> } from './app/remote-entry/entry<%= componentFileSuffix %>';
+import { config } from './app/app.config.server';
 
-const bootstrap = () => bootstrapApplication(RemoteEntryComponent, config);
+const bootstrap = () => bootstrapApplication(RemoteEntry<%= componentType %>, config);
 
 export default bootstrap;

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

@@ -4,6 +4,7 @@ exports.updateSsrSetup = updateSsrSetup;
 const devkit_1 = require("@nx/devkit");
 const path_1 = require("path");
 const versions_1 = require("../../../utils/versions");
+const artifact_types_1 = require("../../utils/artifact-types");
 const version_utils_1 = require("../../utils/version-utils");
 async function updateSsrSetup(tree, { appName, port, standalone, typescriptConfiguration, skipPackageJson, }) {
     const { major: angularMajorVersion } = (0, version_utils_1.getInstalledAngularVersionInfo)(tree);
@@ -28,9 +29,13 @@ async function updateSsrSetup(tree, { appName, port, standalone, typescriptConfi
         tmpl: '',
     });
     if (standalone) {
+        const componentType = (0, artifact_types_1.getComponentType)(tree);
+        const componentFileSuffix = componentType ? `.${componentType}` : '';
         (0, devkit_1.generateFiles)(tree, (0, devkit_1.joinPathFragments)(__dirname, '../files/standalone'), project.root, {
             appName,
             standalone,
+            componentType: componentType ? (0, devkit_1.names)(componentType).className : '',
+            componentFileSuffix,
             tmpl: '',
         });
     }

package/src/generators/remote/remote.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.remote = remote;
+const tslib_1 = require("tslib");
 const devkit_1 = require("@nx/devkit");
 const project_name_and_root_utils_1 = require("@nx/devkit/src/generators/project-name-and-root-utils");
 const ts_solution_setup_1 = require("@nx/js/src/utils/typescript/ts-solution-setup");
@@ -10,8 +11,14 @@ const application_1 = require("../application/application");
 const setup_mf_1 = require("../setup-mf/setup-mf");
 const add_mf_env_to_inputs_1 = require("../utils/add-mf-env-to-inputs");
 const lib_1 = require("./lib");
+const assert_mf_utils_1 = require("../utils/assert-mf-utils");
+const convert_to_rspack_1 = tslib_1.__importDefault(require("../convert-to-rspack/convert-to-rspack"));
 async function remote(tree, schema) {
     (0, ts_solution_setup_1.assertNotUsingTsSolutionSetup)(tree, 'angular', 'remote');
+    // TODO: Replace with Rspack when confidence is high enough
+    schema.bundler ??= 'webpack';
+    const isRspack = schema.bundler === 'rspack';
+    (0, assert_mf_utils_1.assertRspackIsCSR)(schema.bundler, schema.ssr ?? false, schema.serverRouting ?? false);
     const { typescriptConfiguration = true, ...options } = schema;
     options.standalone = options.standalone ?? true;
     const projects = (0, devkit_1.getProjects)(tree);
@@ -75,6 +82,22 @@ async function remote(tree, schema) {
         installTasks.push(ssrInstallTask);
     }
     (0, add_mf_env_to_inputs_1.addMfEnvToTargetDefaultInputs)(tree);
+    if (isRspack) {
+        await (0, convert_to_rspack_1.default)(tree, {
+            project: remoteProjectName,
+            skipInstall: options.skipPackageJson,
+            skipFormat: true,
+        });
+    }
+    const project = (0, devkit_1.readProjectConfiguration)(tree, remoteProjectName);
+    project.targets.serve ??= {};
+    project.targets.serve.options ??= {};
+    if (options.host) {
+        project.targets.serve.dependsOn ??= [];
+        project.targets.serve.dependsOn.push(`${options.host}:serve`);
+    }
+    project.targets.serve.options.port = port;
+    (0, devkit_1.updateProjectConfiguration)(tree, remoteProjectName, project);
     if (!options.skipFormat) {
         await (0, devkit_1.formatFiles)(tree);
     }

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

@@ -5,6 +5,7 @@ import type { Styles } from '../utils/types';
 export interface Schema {
   directory: string;
   name?: string;
+  bundler?: 'webpack' | 'rspack';
   host?: string;
   port?: number;
   setParserOptionsProject?: boolean;

package/src/generators/remote/schema.json

@@ -42,6 +42,12 @@
       "type": "number",
       "description": "The port on which this app should be served."
     },
+    "bundler": {
+      "type": "string",
+      "description": "The bundler to use for the remote application.",
+      "default": "webpack",
+      "enum": ["webpack", "rspack"]
+    },
     "style": {
       "description": "The file extension to be used for style files.",
       "type": "string",
@@ -165,7 +171,7 @@
       "default": false
     },
     "serverRouting": {
-      "description": "Creates a server application using the Server Routing and App Engine APIs (Developer Preview). _Note: this is only supported in Angular versions >= 19.0.0_.",
+      "description": "Creates a server application using the Server Routing and App Engine APIs for application using the `application` builder (Developer Preview). _Note: this is only supported in Angular versions 19.x.x_. From Angular 20 onwards, SSR will always enable server routing when using the `application` builder.",
       "type": "boolean"
     },
     "typescriptConfiguration": {

package/src/generators/scam/lib/convert-component-to-scam.js

@@ -1,7 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.convertComponentToScam = convertComponentToScam;
-const devkit_1 = require("@nx/devkit");
 const js_1 = require("@nx/js");
 const ensure_typescript_1 = require("@nx/js/src/utils/typescript/ensure-typescript");
 let tsModule;
@@ -22,8 +21,7 @@ function convertComponentToScam(tree, options) {
         tree.write(options.filePath, updatedComponentSource);
         return;
     }
-    const moduleFilePath = (0, devkit_1.joinPathFragments)(options.directory, `${options.name}.module.ts`);
-    tree.write(moduleFilePath, getModuleFileContent(options.symbolName, options.fileName));
+    tree.write(options.modulePath, getModuleFileContent(options.symbolName, options.fileName));
 }
 function getModuleFileContent(componentClassName, componentFileName) {
     return `import { NgModule } from '@angular/core';

package/src/generators/scam/lib/normalize-options.js

@@ -3,20 +3,27 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.normalizeOptions = normalizeOptions;
 const devkit_1 = require("@nx/devkit");
 const artifact_name_and_directory_utils_1 = require("@nx/devkit/src/generators/artifact-name-and-directory-utils");
+const artifact_types_1 = require("../../utils/artifact-types");
 const validations_1 = require("../../utils/validations");
+const version_utils_1 = require("../../utils/version-utils");
 async function normalizeOptions(tree, options) {
-    options.type ??= 'component';
+    const { major: angularMajorVersion } = (0, version_utils_1.getInstalledAngularVersionInfo)(tree);
+    if (angularMajorVersion < 20) {
+        options.type ??= 'component';
+    }
     const { artifactName: name, directory, fileName, filePath, project: projectName, } = await (0, artifact_name_and_directory_utils_1.determineArtifactNameAndDirectoryOptions)(tree, {
         name: options.name,
         path: options.path,
-        suffix: options.type ?? 'component',
+        suffix: options.type,
         allowedFileExtensions: ['ts'],
         fileExtension: 'ts',
     });
     const { className } = (0, devkit_1.names)(name);
-    const { className: suffixClassName } = (0, devkit_1.names)(options.type);
+    const suffixClassName = options.type ? (0, devkit_1.names)(options.type).className : '';
     const symbolName = `${className}${suffixClassName}`;
     (0, validations_1.validateClassName)(symbolName);
+    const moduleTypeSeparator = (0, artifact_types_1.getModuleTypeSeparator)(tree);
+    const modulePath = (0, devkit_1.joinPathFragments)(directory, `${name}${moduleTypeSeparator}module.ts`);
     return {
         ...options,
         export: options.export ?? true,
@@ -27,5 +34,6 @@ async function normalizeOptions(tree, options) {
         name,
         symbolName,
         projectName,
+        modulePath,
     };
 }

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

@@ -26,4 +26,5 @@ export interface NormalizedSchema extends Schema {
   symbolName: string;
   export: boolean;
   inlineScam: boolean;
+  modulePath: string;
 }

package/src/generators/scam/schema.json

@@ -94,8 +94,7 @@
     },
     "type": {
       "type": "string",
-      "description": "Adds a developer-defined type to the filename, in the format `name.type.ts`.",
-      "default": "component"
+      "description": "Append a custom type to the component's filename. It defaults to 'component' for Angular versions below v20. For Angular v20 and above, no type is appended unless specified."
     },
     "prefix": {
       "type": "string",

package/src/generators/scam-directive/lib/convert-directive-to-scam.js

@@ -1,7 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.convertDirectiveToScam = convertDirectiveToScam;
-const devkit_1 = require("@nx/devkit");
 const js_1 = require("@nx/js");
 const ensure_typescript_1 = require("@nx/js/src/utils/typescript/ensure-typescript");
 let tsModule;
@@ -22,8 +21,7 @@ function convertDirectiveToScam(tree, options) {
         tree.write(options.filePath, updatedDirectiveSource);
         return;
     }
-    const scamFilePath = (0, devkit_1.joinPathFragments)(options.directory, `${options.name}.module.ts`);
-    tree.write(scamFilePath, getModuleFileContent(options.symbolName, options.fileName));
+    tree.write(options.modulePath, getModuleFileContent(options.symbolName, options.fileName));
 }
 function getModuleFileContent(directiveClassName, directiveFileName) {
     return `import { NgModule } from '@angular/core';