@nx/angular 0.0.0-pr-22179-271588f → 0.0.0-pr-26482-ebe2dba

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

@@ -1,4 +1,9 @@
 import { Tree } from '@nx/devkit';
-import type { Schema } from '../schema';
+export type AddRemoteOptions = {
+    host: string;
+    appName: string;
+    standalone: boolean;
+    port: number;
+};
 export declare function checkIsCommaNeeded(mfRemoteText: string): boolean;
-export declare function addRemoteToHost(tree: Tree, options: Schema): void;
+export declare function addRemoteToHost(tree: Tree, options: AddRemoteOptions): void;

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

@@ -18,8 +18,8 @@ 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 pathToMFManifest = getDynamicManifestFile(tree, hostProject);
+        const hostFederationType = !!pathToMFManifest ? 'dynamic' : 'static';
         const isHostUsingTypescriptConfig = tree.exists((0, devkit_1.joinPathFragments)(hostProject.root, 'module-federation.config.ts'));
         if (hostFederationType === 'static') {
             addRemoteToStaticHost(tree, options, hostProject, isHostUsingTypescriptConfig);
@@ -27,28 +27,24 @@ function addRemoteToHost(tree, options) {
         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 getDynamicManifestFile(tree, project) {
+    // {sourceRoot}/assets/module-federation.manifest.json was the generated
+    // path for the manifest file in the past. We now generate the manifest
+    // file at {root}/public/module-federation.manifest.json. This check
+    // ensures that we can still support the old path for backwards
+    // compatibility since old projects may still have the manifest file
+    // at the old path.
+    return [
+        (0, devkit_1.joinPathFragments)(project.root, 'public/module-federation.manifest.json'),
+        (0, devkit_1.joinPathFragments)(project.sourceRoot, 'assets/module-federation.manifest.json'),
+    ].find((path) => tree.exists(path));
 }
-function addRemoteToStaticHost(tree, options, hostProject, isHostUsingTypescrpt) {
-    const hostMFConfigPath = (0, devkit_1.joinPathFragments)(hostProject.root, isHostUsingTypescrpt
+function addRemoteToStaticHost(tree, options, hostProject, isHostUsingTypescript) {
+    const hostMFConfigPath = (0, devkit_1.joinPathFragments)(hostProject.root, isHostUsingTypescript
         ? 'module-federation.config.ts'
         : 'module-federation.config.js');
     if (!hostMFConfigPath || !tree.exists(hostMFConfigPath)) {

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

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

@@ -12,15 +12,22 @@ function fixBootstrap(tree, appRoot, options) {
         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';
+    if (options.mfType === 'remote' || options.federationType === 'static') {
+        tree.write(mainFilePath, `${bootstrapImportCode};`);
+    }
+    else {
+        let manifestPath = '/assets/module-federation.manifest.json';
+        if (tree.exists((0, devkit_1.joinPathFragments)(appRoot, 'public/module-federation.manifest.json'))) {
+            manifestPath = '/module-federation.manifest.json';
+        }
+        const fetchMFManifestCode = `import { setRemoteDefinitions } from '@nx/angular/mf';
 
-fetch('/assets/module-federation.manifest.json')
+fetch('${manifestPath}')
   .then((res) => res.json())
   .then(definitions => setRemoteDefinitions(definitions))
   .then(() => ${bootstrapImportCode});`;
-    tree.write(mainFilePath, options.mfType === 'host' && options.federationType === 'dynamic'
-        ? fetchMFManifestCode
-        : `${bootstrapImportCode};`);
+        tree.write(mainFilePath, fetchMFManifestCode);
+    }
 }
 exports.fixBootstrap = fixBootstrap;
 const standaloneBootstrapCode = () => `import { bootstrapApplication } from '@angular/platform-browser';

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

@@ -18,6 +18,7 @@ function generateWebpackConfig(tree, options, appRoot, remotesWithPorts) {
     (0, devkit_1.generateFiles)(tree, (0, devkit_1.joinPathFragments)(__dirname, `../files/${pathToWebpackTemplateFiles}`), appRoot, {
         tmpl: '',
         type: options.mfType,
+        federationType: options.federationType,
         name: options.appName,
         remotes: remotesWithPorts ?? [],
         projectRoot: appRoot,

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

@@ -2,12 +2,16 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.setupHostIfDynamic = void 0;
 const devkit_1 = require("@nx/devkit");
+const version_utils_1 = require("../../utils/version-utils");
 function setupHostIfDynamic(tree, options) {
     if (options.federationType === 'static') {
         return;
     }
+    const { major: angularMajorVersion } = (0, version_utils_1.getInstalledAngularVersionInfo)(tree);
     const project = (0, devkit_1.readProjectConfiguration)(tree, options.appName);
-    const pathToMFManifest = (0, devkit_1.joinPathFragments)(project.sourceRoot, 'assets/module-federation.manifest.json');
+    const pathToMFManifest = angularMajorVersion >= 18
+        ? (0, devkit_1.joinPathFragments)(project.root, 'public/module-federation.manifest.json')
+        : (0, devkit_1.joinPathFragments)(project.sourceRoot, 'assets/module-federation.manifest.json');
     if (!tree.exists(pathToMFManifest)) {
         tree.write(pathToMFManifest, '{}');
     }

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

@@ -11,11 +11,8 @@ function updateHostAppRoutes(tree, options) {
         tsModule = (0, ensure_typescript_1.ensureTypescript)();
     }
     const { sourceRoot } = (0, project_configuration_1.readProjectConfiguration)(tree, options.appName);
-    const remoteRoutes = options.remotes && Array.isArray(options.remotes)
-        ? options.remotes.reduce((routes, remote) => `${routes}\n<li><a routerLink='${remote}'>${(0, devkit_1.names)(remote).className}</a></li>`, '')
-        : '';
     tree.write((0, devkit_1.joinPathFragments)(sourceRoot, 'app/app.component.html'), `<ul class="remote-menu">
-<li><a routerLink="/">Home</a></li>${remoteRoutes}
+<li><a routerLink="/">Home</a></li>
 </ul>
 <router-outlet></router-outlet>
 `);

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

@@ -9,23 +9,40 @@ async function setupMf(tree, rawOptions) {
     const projectConfig = (0, devkit_1.readProjectConfiguration)(tree, options.appName);
     let installTask = () => { };
     if (options.mfType === 'remote') {
-        (0, lib_1.addRemoteToHost)(tree, options);
+        (0, lib_1.addRemoteToHost)(tree, {
+            appName: options.appName,
+            host: options.host,
+            standalone: options.standalone,
+            port: options.port,
+        });
         (0, lib_1.addRemoteEntry)(tree, options, projectConfig.root);
         (0, lib_1.removeDeadCodeFromRemote)(tree, options);
         (0, lib_1.setupTspathForRemote)(tree, options);
-        installTask = (0, devkit_1.addDependenciesToPackageJson)(tree, {}, { '@nx/web': versions_1.nxVersion, '@nx/webpack': versions_1.nxVersion });
+        if (!options.skipPackageJson) {
+            installTask = (0, devkit_1.addDependenciesToPackageJson)(tree, {}, { '@nx/web': versions_1.nxVersion, '@nx/webpack': versions_1.nxVersion });
+        }
     }
     const remotesWithPorts = (0, lib_1.getRemotesWithPorts)(tree, options);
     (0, lib_1.generateWebpackConfig)(tree, options, projectConfig.root, remotesWithPorts);
     (0, lib_1.changeBuildTarget)(tree, options);
     (0, lib_1.updateTsConfig)(tree, options);
     (0, lib_1.setupServeTarget)(tree, options);
-    (0, lib_1.fixBootstrap)(tree, projectConfig.root, options);
     if (options.mfType === 'host') {
         (0, lib_1.setupHostIfDynamic)(tree, options);
         (0, lib_1.updateHostAppRoutes)(tree, options);
-        installTask = (0, devkit_1.addDependenciesToPackageJson)(tree, {}, { '@nx/webpack': versions_1.nxVersion });
+        for (const { remoteName, port } of remotesWithPorts) {
+            (0, lib_1.addRemoteToHost)(tree, {
+                appName: remoteName,
+                host: options.appName,
+                standalone: options.standalone,
+                port,
+            });
+        }
+        if (!options.skipPackageJson) {
+            installTask = (0, devkit_1.addDependenciesToPackageJson)(tree, {}, { '@nx/webpack': versions_1.nxVersion });
+        }
     }
+    (0, lib_1.fixBootstrap)(tree, projectConfig.root, options);
     if (!options.skipE2E) {
         (0, lib_1.addCypressOnErrorWorkaround)(tree, options);
     }

package/src/generators/setup-ssr/files/server/application-builder/__serverFileName__

@@ -20,12 +20,13 @@ export function app(): express.Express {
   // Example Express Rest API endpoints
   // server.get('/api/**', (req, res) => { });
   // Serve static files from /browser
-  server.get('*.*', express.static(browserDistFolder, {
-    maxAge: '1y'
+  server.get('**', express.static(browserDistFolder, {
+    maxAge: '1y',
+    index: 'index.html',
   }));
 
   // All regular routes use the Angular engine
-  server.get('*', (req, res, next) => {
+  server.get('**', (req, res, next) => {
     const { protocol, originalUrl, baseUrl, headers } = req;
 
     commonEngine

package/src/generators/setup-ssr/files/server/server-builder/v17+/__serverFileName__

@@ -23,12 +23,13 @@ export function app(): express.Express {
   // Example Express Rest API endpoints
   // server.get('/api/**', (req, res) => { });
   // Serve static files from /browser
-  server.get('*.*', express.static(distFolder, {
-    maxAge: '1y'
+  server.get('**', express.static(distFolder, {
+    maxAge: '1y',
+    index: 'index.html'
   }));
 
   // All regular routes use the Angular engine
-  server.get('*', (req, res, next) => {
+  server.get('**', (req, res, next) => {
     const { protocol, originalUrl, baseUrl, headers } = req;
 
     commonEngine

package/src/generators/setup-ssr/lib/add-dependencies.js

@@ -26,7 +26,8 @@ function addDependencies(tree, isUsingApplicationBuilder) {
     else {
         dependencies['@nguniversal/express-engine'] =
             (0, version_utils_1.getInstalledPackageVersionInfo)(tree, '@nguniversal/express-engine')
-                ?.version ?? pkgVersions.ngUniversalVersion;
+                ?.version ??
+                pkgVersions.ngUniversalVersion;
         devDependencies['@nguniversal/builders'] =
             (0, version_utils_1.getInstalledPackageVersionInfo)(tree, '@nguniversal/builders')?.version ??
                 pkgVersions.ngUniversalVersion;

package/src/generators/setup-ssr/lib/generate-files.js

@@ -2,8 +2,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.generateSSRFiles = void 0;
 const devkit_1 = require("@nx/devkit");
-const semver_1 = require("semver");
-const version_utils_1 = require("../../utils/version-utils");
 function generateSSRFiles(tree, schema, isUsingApplicationBuilder) {
     const { root: projectRoot, targets } = (0, devkit_1.readProjectConfiguration)(tree, schema.project);
     if (targets.server ||
@@ -12,15 +10,11 @@ function generateSSRFiles(tree, schema, isUsingApplicationBuilder) {
         return;
     }
     const pathToFiles = (0, devkit_1.joinPathFragments)(__dirname, '..', 'files');
-    const { version: angularVersion } = (0, version_utils_1.getInstalledAngularVersionInfo)(tree);
     if (schema.standalone) {
         (0, devkit_1.generateFiles)(tree, (0, devkit_1.joinPathFragments)(pathToFiles, 'standalone'), projectRoot, { ...schema, tpl: '' });
     }
     else {
-        (0, devkit_1.generateFiles)(tree, (0, devkit_1.joinPathFragments)(pathToFiles, 'ngmodule', 'base'), projectRoot, { ...schema, tpl: '' });
-        if ((0, semver_1.lt)(angularVersion, '15.2.0')) {
-            (0, devkit_1.generateFiles)(tree, (0, devkit_1.joinPathFragments)(pathToFiles, 'ngmodule', 'pre-v15-2'), projectRoot, { ...schema, tpl: '' });
-        }
+        (0, devkit_1.generateFiles)(tree, (0, devkit_1.joinPathFragments)(pathToFiles, 'ngmodule'), projectRoot, { ...schema, tpl: '' });
     }
 }
 exports.generateSSRFiles = generateSSRFiles;

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

@@ -3,7 +3,6 @@ export * from './add-server-file';
 export * from './generate-files';
 export * from './generate-server-ts-config';
 export * from './normalize-options';
-export * from './update-app-module';
 export * from './update-project-config';
 export * from './validate-options';
 export * from './add-hydration';

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

@@ -6,7 +6,6 @@ tslib_1.__exportStar(require("./add-server-file"), exports);
 tslib_1.__exportStar(require("./generate-files"), exports);
 tslib_1.__exportStar(require("./generate-server-ts-config"), exports);
 tslib_1.__exportStar(require("./normalize-options"), exports);
-tslib_1.__exportStar(require("./update-app-module"), exports);
 tslib_1.__exportStar(require("./update-project-config"), exports);
 tslib_1.__exportStar(require("./validate-options"), exports);
 tslib_1.__exportStar(require("./add-hydration"), exports);

package/src/generators/setup-ssr/lib/validate-options.js

@@ -3,12 +3,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.validateOptions = void 0;
 const devkit_1 = require("@nx/devkit");
 const validations_1 = require("../../utils/validations");
-const version_utils_1 = require("../../utils/version-utils");
-const semver_1 = require("semver");
 function validateOptions(tree, options) {
     validateProject(tree, options.project);
     validateBuildTarget(tree, options.project);
-    validateHydrationOption(tree, options.hydration);
 }
 exports.validateOptions = validateOptions;
 function validateProject(tree, project) {
@@ -24,13 +21,3 @@ function validateBuildTarget(tree, project) {
         throw new Error(`The "${project}" project does not have a "build" target. Please add a "build" target.`);
     }
 }
-function validateHydrationOption(tree, hydration) {
-    if (!hydration) {
-        return;
-    }
-    const installedAngularVersion = (0, version_utils_1.getInstalledAngularVersionInfo)(tree).version;
-    if ((0, semver_1.lt)(installedAngularVersion, '16.0.0')) {
-        throw new Error((0, devkit_1.stripIndents) `The "hydration" option is only supported in Angular >= 16.0.0. You are currently using "${installedAngularVersion}".
-    You can resolve this error by removing the "hydration" option or by migrating to Angular 16.0.0.`);
-    }
-}

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

@@ -9,4 +9,5 @@ export interface Schema {
   standalone?: boolean;
   hydration?: boolean;
   skipFormat?: boolean;
+  skipPackageJson?: boolean;
 }

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

@@ -19,8 +19,9 @@
     "appId": {
       "type": "string",
       "format": "html-selector",
-      "description": "The `appId` to use with `withServerTransition`. _Note: This is only used in Angular versions <16.0.0. It's deprecated since Angular 16 and not supported since Angular 17._",
-      "default": "serverApp"
+      "description": "The `appId` to use with `withServerTransition`.",
+      "default": "serverApp",
+      "x-deprecated": "This is deprecated and ignored since Angular 16 and not supported since Angular 17."
     },
     "main": {
       "type": "string",
@@ -55,12 +56,18 @@
     },
     "hydration": {
       "type": "boolean",
-      "description": "Set up Hydration for the SSR application. It defaults to `true` for Angular versions >= 17.0.0. Otherwise, it defaults to `false`. _Note: This is only supported in Angular versions >= 16.0.0_."
+      "description": "Set up Hydration for the SSR application. It defaults to `true` for Angular versions >= 17.0.0. Otherwise, it defaults to `false`."
     },
     "skipFormat": {
       "type": "boolean",
       "description": "Skip formatting the workspace after the generator completes.",
       "x-priority": "internal"
+    },
+    "skipPackageJson": {
+      "type": "boolean",
+      "default": false,
+      "description": "Do not add dependencies to `package.json`.",
+      "x-priority": "internal"
     }
   },
   "required": ["project"],

package/src/generators/setup-ssr/setup-ssr.js

@@ -10,11 +10,10 @@ async function setupSsr(tree, schema) {
     const { targets } = (0, devkit_1.readProjectConfiguration)(tree, options.project);
     const isUsingApplicationBuilder = targets.build.executor === '@angular-devkit/build-angular:application' ||
         targets.build.executor === '@nx/angular:application';
-    (0, lib_1.addDependencies)(tree, isUsingApplicationBuilder);
-    (0, lib_1.generateSSRFiles)(tree, options, isUsingApplicationBuilder);
-    if (!options.standalone) {
-        (0, lib_1.updateAppModule)(tree, options);
+    if (!schema.skipPackageJson) {
+        (0, lib_1.addDependencies)(tree, isUsingApplicationBuilder);
     }
+    (0, lib_1.generateSSRFiles)(tree, options, isUsingApplicationBuilder);
     if (options.hydration) {
         (0, lib_1.addHydration)(tree, options);
     }

package/src/generators/stories/stories.js

@@ -1,9 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.angularStoriesGenerator = void 0;
+const tslib_1 = require("tslib");
 const devkit_1 = require("@nx/devkit");
-const component_cypress_spec_1 = require("../component-cypress-spec/component-cypress-spec");
-const component_story_1 = require("../component-story/component-story");
+const component_cypress_spec_1 = tslib_1.__importDefault(require("../component-cypress-spec/component-cypress-spec"));
+const component_story_1 = tslib_1.__importDefault(require("../component-story/component-story"));
 const component_info_1 = require("../utils/storybook-ast/component-info");
 const entry_point_1 = require("../utils/storybook-ast/entry-point");
 const get_e2e_project_1 = require("./lib/get-e2e-project");

package/src/generators/storybook-configuration/lib/generate-stories.js

@@ -7,7 +7,7 @@ const stories_1 = require("../../stories/stories");
 async function generateStories(tree, options) {
     const project = (0, devkit_1.readProjectConfiguration)(tree, options.project);
     (0, devkit_1.ensurePackage)('@nx/cypress', versions_1.nxVersion);
-    const { getE2eProjectName } = await Promise.resolve().then(() => require('@nx/cypress/src/utils/project-name'));
+    const { getE2eProjectName } = require('@nx/cypress/src/utils/project-name');
     const e2eProjectName = getE2eProjectName(options.project, project.root, options.cypressDirectory);
     await (0, stories_1.angularStoriesGenerator)(tree, {
         name: options.project,

package/src/generators/storybook-configuration/schema.json

@@ -29,7 +29,7 @@
     "configureCypress": {
       "type": "boolean",
       "description": "Specifies whether to configure Cypress or not.",
-      "x-deprecated": "Use interactionTests instead. This option will be removed in v19."
+      "x-deprecated": "Use interactionTests instead. This option will be removed in v20."
     },
     "generateStories": {
       "type": "boolean",
@@ -41,7 +41,7 @@
     "generateCypressSpecs": {
       "type": "boolean",
       "description": "Specifies whether to automatically generate test files in the generated Cypress e2e app.",
-      "x-deprecated": "Use interactionTests instead. This option will be removed in v19."
+      "x-deprecated": "Use interactionTests instead. This option will be removed in v20."
     },
     "configureStaticServe": {
       "type": "boolean",
@@ -53,7 +53,7 @@
     "cypressDirectory": {
       "type": "string",
       "description": "A directory where the Cypress project will be placed. Placed at the root by default.",
-      "x-deprecated": "Use interactionTests instead. This option will be removed in v19."
+      "x-deprecated": "Use interactionTests instead. This option will be removed in v20."
     },
     "linter": {
       "description": "The tool to use for running lint checks.",

package/src/generators/utils/add-jest.js

@@ -3,11 +3,10 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.addJest = void 0;
 const devkit_1 = require("@nx/devkit");
 const versions_1 = require("../../utils/versions");
-const version_utils_1 = require("./version-utils");
 async function addJest(tree, options) {
     if (!options.skipPackageJson) {
         process.env.npm_config_legacy_peer_deps ??= 'true';
-        (0, version_utils_1.addDependenciesToPackageJsonIfDontExist)(tree, {}, { 'jest-preset-angular': versions_1.jestPresetAngularVersion });
+        (0, devkit_1.addDependenciesToPackageJson)(tree, {}, { 'jest-preset-angular': versions_1.jestPresetAngularVersion }, undefined, true);
     }
     const { configurationGenerator } = (0, devkit_1.ensurePackage)('@nx/jest', versions_1.nxVersion);
     await configurationGenerator(tree, {

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

@@ -8,7 +8,10 @@ function addMfEnvToTargetDefaultInputs(tree) {
     const mfEnvVar = 'NX_MF_DEV_SERVER_STATIC_REMOTES';
     nxJson.targetDefaults ??= {};
     nxJson.targetDefaults[webpackExecutor] ??= {};
-    nxJson.targetDefaults[webpackExecutor].inputs ??= [];
+    nxJson.targetDefaults[webpackExecutor].inputs ??= [
+        'production',
+        '^production',
+    ];
     let mfEnvVarExists = false;
     for (const input of nxJson.targetDefaults[webpackExecutor].inputs) {
         if (typeof input === 'object' && input['env'] === mfEnvVar) {

package/src/generators/utils/ensure-angular-dependencies.d.ts

@@ -1,2 +1,2 @@
-import type { GeneratorCallback, Tree } from '@nx/devkit';
+import { type GeneratorCallback, type Tree } from '@nx/devkit';
 export declare function ensureAngularDependencies(tree: Tree): GeneratorCallback;

package/src/generators/utils/ensure-angular-dependencies.js

@@ -1,35 +1,52 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ensureAngularDependencies = void 0;
+const devkit_1 = require("@nx/devkit");
 const version_utils_1 = require("./version-utils");
 function ensureAngularDependencies(tree) {
+    const dependencies = {};
+    const devDependencies = {};
     const pkgVersions = (0, version_utils_1.versions)(tree);
-    const angularVersion = (0, version_utils_1.getInstalledPackageVersion)(tree, '@angular/core') ??
-        pkgVersions.angularVersion;
-    const angularDevkitVersion = (0, version_utils_1.getInstalledPackageVersion)(tree, '@angular-devkit/build-angular') ??
-        pkgVersions.angularDevkitVersion;
-    const rxjsVersion = (0, version_utils_1.getInstalledPackageVersion)(tree, 'rxjs') ?? pkgVersions.rxjsVersion;
-    const tsLibVersion = (0, version_utils_1.getInstalledPackageVersion)(tree, 'tslib') ?? pkgVersions.tsLibVersion;
-    const zoneJsVersion = (0, version_utils_1.getInstalledPackageVersion)(tree, 'zone.js') ?? pkgVersions.zoneJsVersion;
-    return (0, version_utils_1.addDependenciesToPackageJsonIfDontExist)(tree, {
-        '@angular/animations': angularVersion,
-        '@angular/common': angularVersion,
-        '@angular/compiler': angularVersion,
-        '@angular/core': angularVersion,
-        '@angular/forms': angularVersion,
-        '@angular/platform-browser': angularVersion,
-        '@angular/platform-browser-dynamic': angularVersion,
-        '@angular/router': angularVersion,
-        rxjs: rxjsVersion,
-        tslib: tsLibVersion,
-        'zone.js': zoneJsVersion,
-    }, {
-        '@angular/cli': angularDevkitVersion,
-        '@angular/compiler-cli': angularVersion,
-        '@angular/language-service': angularVersion,
-        '@angular-devkit/build-angular': angularDevkitVersion,
-        '@angular-devkit/schematics': angularDevkitVersion,
-        '@schematics/angular': angularDevkitVersion,
-    });
+    const installedAngularCoreVersion = (0, version_utils_1.getInstalledPackageVersion)(tree, '@angular/core');
+    if (!installedAngularCoreVersion) {
+        /**
+         * If @angular/core is already installed, we assume the workspace was already
+         * initialized with Angular dependencies and we don't want to re-install them.
+         * This is to avoid re-installing Angular runtime dependencies that the user
+         * might have removed.
+         */
+        const angularVersion = pkgVersions.angularVersion;
+        const rxjsVersion = (0, version_utils_1.getInstalledPackageVersion)(tree, 'rxjs') ?? pkgVersions.rxjsVersion;
+        const tsLibVersion = (0, version_utils_1.getInstalledPackageVersion)(tree, 'tslib') ?? pkgVersions.tsLibVersion;
+        const zoneJsVersion = (0, version_utils_1.getInstalledPackageVersion)(tree, 'zone.js') ?? pkgVersions.zoneJsVersion;
+        dependencies['@angular/animations'] = angularVersion;
+        dependencies['@angular/common'] = angularVersion;
+        dependencies['@angular/compiler'] = angularVersion;
+        dependencies['@angular/core'] = angularVersion;
+        dependencies['@angular/forms'] = angularVersion;
+        dependencies['@angular/platform-browser'] = angularVersion;
+        dependencies['@angular/platform-browser-dynamic'] = angularVersion;
+        dependencies['@angular/router'] = angularVersion;
+        dependencies.rxjs = rxjsVersion;
+        dependencies.tslib = tsLibVersion;
+        dependencies['zone.js'] = zoneJsVersion;
+    }
+    const installedAngularDevkitVersion = (0, version_utils_1.getInstalledPackageVersion)(tree, '@angular-devkit/build-angular');
+    if (!installedAngularDevkitVersion) {
+        /**
+         * If `@angular-devkit/build-angular` is already installed, we assume the workspace
+         * was already initialized with Angular and we don't want to re-install the tooling.
+         * This is to avoid re-installing Angular tooling that the user might have removed.
+         */
+        devDependencies['@angular/cli'] = pkgVersions.angularDevkitVersion;
+        devDependencies['@angular/compiler-cli'] = pkgVersions.angularVersion;
+        devDependencies['@angular/language-service'] = pkgVersions.angularVersion;
+    }
+    // Ensure the `@nx/angular` peer dependencies are always installed.
+    const angularDevkitVersion = installedAngularDevkitVersion ?? pkgVersions.angularDevkitVersion;
+    devDependencies['@angular-devkit/build-angular'] = angularDevkitVersion;
+    devDependencies['@angular-devkit/schematics'] = angularDevkitVersion;
+    devDependencies['@schematics/angular'] = angularDevkitVersion;
+    return (0, devkit_1.addDependenciesToPackageJson)(tree, dependencies, devDependencies, undefined, true);
 }
 exports.ensureAngularDependencies = ensureAngularDependencies;

package/src/generators/utils/storybook-ast/tree-utilities.js

@@ -1,8 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getAllFilesRecursivelyFromDir = void 0;
+const tslib_1 = require("tslib");
 const devkit_1 = require("@nx/devkit");
-const ignore_1 = require("ignore");
+const ignore_1 = tslib_1.__importDefault(require("ignore"));
 function getAllFilesRecursivelyFromDir(tree, dir) {
     if (isPathIgnored(tree, dir)) {
         return [];

package/src/generators/utils/testing.js

@@ -5,14 +5,12 @@ const devkit_1 = require("@nx/devkit");
 const testing_1 = require("@nx/devkit/testing");
 const eslint_1 = require("@nx/eslint");
 const test_runners_1 = require("../../utils/test-runners");
-const versions_1 = require("../../utils/versions");
 const application_1 = require("../application/application");
 const component_1 = require("../component/component");
 const host_1 = require("../host/host");
 const library_1 = require("../library/library");
 const remote_1 = require("../remote/remote");
 async function generateTestApplication(tree, options) {
-    addAngularPluginPeerDeps(tree);
     tree.write('.gitignore', '');
     await (0, application_1.applicationGenerator)(tree, {
         projectNameAndRootFormat: 'as-provided',
@@ -21,19 +19,16 @@ async function generateTestApplication(tree, options) {
 }
 exports.generateTestApplication = generateTestApplication;
 async function generateTestHostApplication(tree, options) {
-    addAngularPluginPeerDeps(tree);
     tree.write('.gitignore', '');
     await (0, host_1.host)(tree, { projectNameAndRootFormat: 'as-provided', ...options });
 }
 exports.generateTestHostApplication = generateTestHostApplication;
 async function generateTestRemoteApplication(tree, options) {
-    addAngularPluginPeerDeps(tree);
     tree.write('.gitignore', '');
     await (0, remote_1.remote)(tree, { projectNameAndRootFormat: 'as-provided', ...options });
 }
 exports.generateTestRemoteApplication = generateTestRemoteApplication;
 async function generateTestLibrary(tree, options) {
-    addAngularPluginPeerDeps(tree);
     tree.write('.gitignore', '');
     await (0, library_1.libraryGenerator)(tree, {
         projectNameAndRootFormat: 'as-provided',
@@ -43,7 +38,6 @@ async function generateTestLibrary(tree, options) {
 exports.generateTestLibrary = generateTestLibrary;
 async function createStorybookTestWorkspaceForLib(libName) {
     let tree = (0, testing_1.createTreeWithEmptyWorkspace)({ layout: 'apps-libs' });
-    addAngularPluginPeerDeps(tree);
     tree.write('.gitignore', '');
     await (0, library_1.libraryGenerator)(tree, {
         name: libName,
@@ -243,17 +237,6 @@ export class StaticMemberDeclarationsModule {
     return tree;
 }
 exports.createStorybookTestWorkspaceForLib = createStorybookTestWorkspaceForLib;
-function addAngularPluginPeerDeps(tree) {
-    (0, devkit_1.updateJson)(tree, 'package.json', (json) => ({
-        ...json,
-        devDependencies: {
-            ...json.devDependencies,
-            '@angular-devkit/core': versions_1.angularDevkitVersion,
-            '@angular-devkit/schematics': versions_1.angularDevkitVersion,
-            '@schematics/angular': versions_1.angularDevkitVersion,
-        },
-    }));
-}
 function generateModule(tree, options) {
     const project = (0, devkit_1.readProjectConfiguration)(tree, options.project);
     if (options.path === undefined) {

package/src/generators/utils/version-utils.d.ts

@@ -1,4 +1,4 @@
-import type { GeneratorCallback, Tree } from '@nx/devkit';
+import { type Tree } from '@nx/devkit';
 import { type PackageCompatVersions, type PackageLatestVersions } from '../../utils/backward-compatible-versions';
 export declare function getInstalledAngularVersion(tree: Tree): string;
 export declare function getInstalledAngularMajorVersion(tree: Tree): number;
@@ -11,5 +11,4 @@ export declare function getInstalledPackageVersionInfo(tree: Tree, pkgName: stri
     major: number;
     version: string;
 };
-export declare function addDependenciesToPackageJsonIfDontExist(tree: Tree, dependencies: Record<string, string>, devDependencies: Record<string, string>, packageJsonPath?: string): GeneratorCallback;
 export declare function versions(tree: Tree): PackageLatestVersions | PackageCompatVersions;