feat(angular): support angular 15.1.0 (#14103)

docs/generated/packages/angular/executors/webpack-server.json

@@ -9,6 +9,45 @@
     "description": "The webpack-dev-server executor is very similar to the standard server builder provided by the Angular Devkit. It is usually used in tandem with `@nrwl/angular:webpack-browser` when your Angular application uses a custom webpack configuration and NgUniversal for SSR.",
     "type": "object",
     "properties": {
+      "assets": {
+        "type": "array",
+        "description": "List of static application assets.",
+        "default": [],
+        "items": {
+          "oneOf": [
+            {
+              "type": "object",
+              "properties": {
+                "followSymlinks": {
+                  "type": "boolean",
+                  "default": false,
+                  "description": "Allow glob patterns to follow symlink directories. This allows subdirectories of the symlink to be searched."
+                },
+                "glob": {
+                  "type": "string",
+                  "description": "The pattern to match."
+                },
+                "input": {
+                  "type": "string",
+                  "description": "The input directory path in which to apply 'glob'. Defaults to the project root."
+                },
+                "ignore": {
+                  "description": "An array of globs to ignore.",
+                  "type": "array",
+                  "items": { "type": "string" }
+                },
+                "output": {
+                  "type": "string",
+                  "description": "Absolute path within the output."
+                }
+              },
+              "additionalProperties": false,
+              "required": ["glob", "input", "output"]
+            },
+            { "type": "string" }
+          ]
+        }
+      },
       "main": {
         "type": "string",
         "description": "The full path for the main entry point to the server app, relative to the current workspace."
@@ -256,6 +295,40 @@
     "additionalProperties": false,
     "required": ["outputPath", "main", "tsConfig"],
     "definitions": {
+      "assetPattern": {
+        "oneOf": [
+          {
+            "type": "object",
+            "properties": {
+              "followSymlinks": {
+                "type": "boolean",
+                "default": false,
+                "description": "Allow glob patterns to follow symlink directories. This allows subdirectories of the symlink to be searched."
+              },
+              "glob": {
+                "type": "string",
+                "description": "The pattern to match."
+              },
+              "input": {
+                "type": "string",
+                "description": "The input directory path in which to apply 'glob'. Defaults to the project root."
+              },
+              "ignore": {
+                "description": "An array of globs to ignore.",
+                "type": "array",
+                "items": { "type": "string" }
+              },
+              "output": {
+                "type": "string",
+                "description": "Absolute path within the output."
+              }
+            },
+            "additionalProperties": false,
+            "required": ["glob", "input", "output"]
+          },
+          { "type": "string" }
+        ]
+      },
       "fileReplacement": {
         "oneOf": [
           {

package.json

@@ -25,19 +25,19 @@
     "root-lint": "nx workspace-lint"
   },
   "devDependencies": {
-    "@angular-devkit/architect": "~0.1500.1",
-    "@angular-devkit/build-angular": "~15.0.1",
-    "@angular-devkit/core": "~15.0.1",
-    "@angular-devkit/schematics": "~15.0.1",
+    "@angular-devkit/architect": "~0.1501.0",
+    "@angular-devkit/build-angular": "~15.1.0",
+    "@angular-devkit/core": "~15.1.0",
+    "@angular-devkit/schematics": "~15.1.0",
     "@angular-eslint/eslint-plugin": "~15.0.0",
     "@angular-eslint/eslint-plugin-template": "~15.0.0",
     "@angular-eslint/template-parser": "~15.0.0",
-    "@angular/cli": "~15.0.1",
-    "@angular/common": "~15.0.1",
-    "@angular/compiler": "~15.0.1",
-    "@angular/compiler-cli": "~15.0.1",
-    "@angular/core": "~15.0.1",
-    "@angular/router": "~15.0.1",
+    "@angular/cli": "~15.1.0",
+    "@angular/common": "~15.1.0",
+    "@angular/compiler": "~15.1.0",
+    "@angular/compiler-cli": "~15.1.0",
+    "@angular/core": "~15.1.0",
+    "@angular/router": "~15.1.0",
     "@babel/core": "^7.15.0",
     "@babel/helper-create-regexp-features-plugin": "^7.14.5",
     "@babel/preset-react": "^7.14.5",
@@ -75,7 +75,7 @@
     "@rollup/plugin-json": "^4.1.0",
     "@rollup/plugin-node-resolve": "^13.0.4",
     "@rollup/plugin-url": "^7.0.0",
-    "@schematics/angular": "~15.0.1",
+    "@schematics/angular": "~15.1.0",
     "@storybook/addon-essentials": "^6.5.15",
     "@storybook/angular": "^6.5.15",
     "@storybook/builder-webpack5": "^6.5.15",
@@ -187,7 +187,7 @@
     "mini-css-extract-plugin": "~2.4.7",
     "minimatch": "3.0.5",
     "next-sitemap": "^3.1.10",
-    "ng-packagr": "~15.0.0",
+    "ng-packagr": "~15.1.0",
     "node-fetch": "^2.6.7",
     "nx": "15.4.5-beta.1",
     "open": "^8.4.0",
@@ -310,7 +310,8 @@
   "resolutions": {
     "**/xmlhttprequest-ssl": "~1.6.2",
     "minimist": "^1.2.6",
-    "underscore": "^1.12.1"
+    "underscore": "^1.12.1",
+    "@nguniversal/builders/@angular-devkit/architect": "~0.1501.0"
   },
   "nx": {
     "includedScripts": [

packages/angular/migrations.json

@@ -226,6 +226,12 @@
       "version": "15.2.0-beta.0",
       "description": "Remove no longer needed require calls in Karma builder main file.",
       "factory": "./src/migrations/update-15-2-0/update-karma-main-file"
+    },
+    "update-angular-cli-version-15-1-0": {
+      "cli": "nx",
+      "version": "15.5.0-beta.0",
+      "description": "Update the @angular/cli package version to ~15.1.0.",
+      "factory": "./src/migrations/update-15-5-0/update-angular-cli"
     }
   },
   "packageJsonUpdates": {
@@ -1086,7 +1092,10 @@
     "13.8.4": {
       "version": "13.8.4-beta.0",
       "packages": {
-        "karma": { "version": "~6.3.0", "alwaysAddToPackageJson": false },
+        "karma": {
+          "version": "~6.3.0",
+          "alwaysAddToPackageJson": false
+        },
         "karma-jasmine-html-reporter": {
           "version": "~1.7.0",
           "alwaysAddToPackageJson": false
@@ -1703,6 +1712,51 @@
           "version": "~15.0.0"
         }
       }
+    },
+    "15.5.0": {
+      "version": "15.5.0-beta.0",
+      "packages": {
+        "@angular-devkit/architect": {
+          "version": "~0.1501.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@angular-devkit/build-angular": {
+          "version": "~15.1.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@angular-devkit/build-webpack": {
+          "version": "~0.1501.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@angular-devkit/core": {
+          "version": "~15.1.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@angular-devkit/schematics": {
+          "version": "~15.1.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@angular/core": {
+          "version": "~15.1.0",
+          "alwaysAddToPackageJson": true
+        },
+        "@angular/material": {
+          "version": "~15.1.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@angular/cdk": {
+          "version": "~15.1.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@schematics/angular": {
+          "version": "~15.1.0",
+          "alwaysAddToPackageJson": false
+        },
+        "ng-packagr": {
+          "version": "~15.1.0",
+          "alwaysAddToPackageJson": false
+        }
+      }
     }
   }
 }

packages/angular/package.json

@@ -39,7 +39,7 @@
     "migrations": "./migrations.json"
   },
   "dependencies": {
-    "@angular-devkit/schematics": "~15.0.1",
+    "@angular-devkit/schematics": "~15.1.0",
     "@nguniversal/builders": "~15.0.0",
     "@nrwl/cypress": "file:../cypress",
     "@nrwl/devkit": "file:../devkit",
@@ -48,7 +48,7 @@
     "@nrwl/webpack": "file:../webpack",
     "@nrwl/workspace": "file:../workspace",
     "@phenomnomnominal/tsquery": "4.1.1",
-    "@schematics/angular": "~15.0.1",
+    "@schematics/angular": "~15.1.0",
     "chalk": "4.1.0",
     "chokidar": "^3.5.1",
     "http-server": "^14.1.0",

packages/angular/src/builders/webpack-server/schema.json

@@ -6,6 +6,14 @@
   "description": "The webpack-dev-server executor is very similar to the standard server builder provided by the Angular Devkit. It is usually used in tandem with `@nrwl/angular:webpack-browser` when your Angular application uses a custom webpack configuration and NgUniversal for SSR.",
   "type": "object",
   "properties": {
+    "assets": {
+      "type": "array",
+      "description": "List of static application assets.",
+      "default": [],
+      "items": {
+        "$ref": "#/definitions/assetPattern"
+      }
+    },
     "main": {
       "type": "string",
       "description": "The full path for the main entry point to the server app, relative to the current workspace."
@@ -238,6 +246,44 @@
   "additionalProperties": false,
   "required": ["outputPath", "main", "tsConfig"],
   "definitions": {
+    "assetPattern": {
+      "oneOf": [
+        {
+          "type": "object",
+          "properties": {
+            "followSymlinks": {
+              "type": "boolean",
+              "default": false,
+              "description": "Allow glob patterns to follow symlink directories. This allows subdirectories of the symlink to be searched."
+            },
+            "glob": {
+              "type": "string",
+              "description": "The pattern to match."
+            },
+            "input": {
+              "type": "string",
+              "description": "The input directory path in which to apply 'glob'. Defaults to the project root."
+            },
+            "ignore": {
+              "description": "An array of globs to ignore.",
+              "type": "array",
+              "items": {
+                "type": "string"
+              }
+            },
+            "output": {
+              "type": "string",
+              "description": "Absolute path within the output."
+            }
+          },
+          "additionalProperties": false,
+          "required": ["glob", "input", "output"]
+        },
+        {
+          "type": "string"
+        }
+      ]
+    },
     "fileReplacement": {
       "oneOf": [
         {

packages/angular/src/migrations/update-15-5-0/update-angular-cli.spec.ts

@@ -0,0 +1,42 @@
+import { readJson, Tree, writeJson } from '@nrwl/devkit';
+import { createTreeWithEmptyWorkspace } from '@nrwl/devkit/testing';
+import updateAngularCli from './update-angular-cli';
+
+describe('update-angular-cli migration', () => {
+  let tree: Tree;
+
+  beforeEach(() => {
+    tree = createTreeWithEmptyWorkspace({ layout: 'apps-libs' });
+  });
+
+  it('should update @angular/cli version when defined as a dev dependency', async () => {
+    writeJson(tree, 'package.json', {
+      devDependencies: { '@angular/cli': '~13.3.0' },
+    });
+
+    await updateAngularCli(tree);
+
+    const { devDependencies } = readJson(tree, 'package.json');
+    expect(devDependencies['@angular/cli']).toEqual('~15.1.0');
+  });
+
+  it('should update @angular/cli version when defined as a dependency', async () => {
+    writeJson(tree, 'package.json', {
+      dependencies: { '@angular/cli': '~13.3.0' },
+    });
+
+    await updateAngularCli(tree);
+
+    const { dependencies } = readJson(tree, 'package.json');
+    expect(dependencies['@angular/cli']).toEqual('~15.1.0');
+  });
+
+  it('should add @angular/cli to package.json when it is not set', async () => {
+    const initialPackageJson = readJson(tree, 'package.json');
+
+    await updateAngularCli(tree);
+
+    const packageJson = readJson(tree, 'package.json');
+    expect(packageJson).toStrictEqual(initialPackageJson);
+  });
+});

packages/angular/src/migrations/update-15-5-0/update-angular-cli.ts

@@ -0,0 +1,23 @@
+import { formatFiles, Tree, updateJson } from '@nrwl/devkit';
+
+const angularCliVersion = '~15.1.0';
+
+export default async function (tree: Tree) {
+  let shouldFormat = false;
+
+  updateJson(tree, 'package.json', (json) => {
+    if (json.devDependencies?.['@angular/cli']) {
+      json.devDependencies['@angular/cli'] = angularCliVersion;
+      shouldFormat = true;
+    } else if (json.dependencies?.['@angular/cli']) {
+      json.dependencies['@angular/cli'] = angularCliVersion;
+      shouldFormat = true;
+    }
+
+    return json;
+  });
+
+  if (shouldFormat) {
+    await formatFiles(tree);
+  }
+}

packages/angular/src/utils/versions.ts

@@ -1,8 +1,8 @@
 export const nxVersion = require('../../package.json').version;
 
-export const angularVersion = '~15.0.0';
-export const angularDevkitVersion = '~15.0.0';
-export const ngPackagrVersion = '~15.0.0';
+export const angularVersion = '~15.1.0';
+export const angularDevkitVersion = '~15.1.0';
+export const ngPackagrVersion = '~15.1.0';
 export const ngrxVersion = '~15.0.0';
 export const rxjsVersion = '~7.5.0';
 export const zoneJsVersion = '~0.11.4';

packages/nx/src/utils/versions.ts

@@ -1,6 +1,6 @@
 export const nxVersion = require('../../package.json').version;
 
-export const angularCliVersion = '~15.0.0';
+export const angularCliVersion = '~15.1.0';
 export const typescriptVersion = '~4.8.2';
 export const prettierVersion = '^2.6.2';
 export const typescriptESLintVersion = '^5.36.1';

packages/workspace/src/utils/versions.ts

@@ -1,6 +1,6 @@
 export const nxVersion = require('../../package.json').version;
 
-export const angularCliVersion = '~15.0.0';
+export const angularCliVersion = '~15.1.0';
 export const typescriptVersion = '~4.8.2';
 export const prettierVersion = '^2.6.2';
 export const typescriptESLintVersion = '^5.36.1';

scripts/angular-support-upgrades/build-migrations.ts

@@ -0,0 +1,110 @@
+import { existsSync, mkdirSync, readFileSync, writeFileSync } from 'fs';
+import {
+  getAngularCliMigrationGenerator,
+  getAngularCliMigrationGeneratorSpec,
+} from './files/angular-cli-upgrade-migration';
+import { join } from 'path';
+
+function addMigrationPackageGroup(
+  angularPackageMigrations: Record<string, any>,
+  targetNxVersion: string,
+  targetNxMigrationVersion: string,
+  packageVersionMap: Map<string, string>
+) {
+  angularPackageMigrations.packageJsonUpdates[targetNxVersion] = {
+    version: `${targetNxMigrationVersion}`,
+    packages: {},
+  };
+
+  for (const [pkgName, version] of packageVersionMap.entries()) {
+    if (
+      pkgName.startsWith('@angular/') &&
+      !['@angular/core', '@angular/material', '@angular/cdk'].includes(pkgName)
+    ) {
+      continue;
+    }
+
+    angularPackageMigrations.packageJsonUpdates[targetNxVersion].packages[
+      pkgName
+    ] = {
+      version: `~${version}`,
+      alwaysAddToPackageJson: pkgName === '@angular/core',
+    };
+  }
+}
+
+export function buildMigrations(
+  packageVersionMap: Map<string, string>,
+  targetNxVersion: string,
+  targetNxMigrationVersion: string
+) {
+  console.log('⏳ - Writing migrations...');
+  const pathToMigrationsJsonFile = 'packages/angular/migrations.json';
+  const angularPackageMigrations = JSON.parse(
+    readFileSync(pathToMigrationsJsonFile, { encoding: 'utf-8' })
+  );
+
+  addMigrationPackageGroup(
+    angularPackageMigrations,
+    targetNxVersion,
+    targetNxMigrationVersion,
+    packageVersionMap
+  );
+
+  const angularCLIVersion = packageVersionMap.get('@angular/cli') as string;
+  const angularCliMigrationGeneratorContents =
+    getAngularCliMigrationGenerator(angularCLIVersion);
+  const angularCliMigrationGeneratorSpecContents =
+    getAngularCliMigrationGeneratorSpec(angularCLIVersion);
+
+  // Create the directory update-targetNxVersion.dasherize()
+  // Write the generator
+  // Update angularPackageMigrations
+
+  const migrationGeneratorFolderName =
+    'update-' + targetNxVersion.replace(/\./g, '-');
+  const migrationFileName = 'update-angular-cli';
+  const generatorName = `update-angular-cli-version-${angularCLIVersion.replace(
+    /\./g,
+    '-'
+  )}`;
+
+  angularPackageMigrations.schematics[generatorName] = {
+    cli: 'nx',
+    version: targetNxMigrationVersion,
+    description: `Update the @angular/cli package version to ~${angularCLIVersion}.`,
+    factory: `./src/migrations/${migrationGeneratorFolderName}/${migrationFileName}`,
+  };
+
+  writeFileSync(
+    pathToMigrationsJsonFile,
+    JSON.stringify(angularPackageMigrations, null, 2)
+  );
+
+  const pathToMigrationFolder = join(
+    'packages/angular/src/migrations',
+    migrationGeneratorFolderName
+  );
+  if (!existsSync(pathToMigrationFolder)) {
+    mkdirSync(pathToMigrationFolder);
+  }
+
+  const pathToMigrationGeneratorFile = join(
+    pathToMigrationFolder,
+    `${migrationFileName}.ts`
+  );
+  const pathToMigrationGeneratorSpecFile = join(
+    pathToMigrationFolder,
+    `${migrationFileName}.spec.ts`
+  );
+  writeFileSync(
+    pathToMigrationGeneratorFile,
+    angularCliMigrationGeneratorContents
+  );
+  writeFileSync(
+    pathToMigrationGeneratorSpecFile,
+    angularCliMigrationGeneratorSpecContents
+  );
+
+  console.log('✅ - Wrote migrations');
+}

scripts/angular-support-upgrades/fetch-versions-from-registry.ts

@@ -0,0 +1,49 @@
+import axios from 'axios';
+import { coerce, gt, SemVer } from 'semver';
+
+const packagesToUpdate = [
+  '@angular-devkit/architect',
+  '@angular-devkit/build-angular',
+  '@angular-devkit/build-webpack',
+  '@angular-devkit/core',
+  '@angular-devkit/schematics',
+  '@angular/cli',
+  '@angular/common',
+  '@angular/compiler',
+  '@angular/compiler-cli',
+  '@angular/core',
+  '@angular/router',
+  '@angular/material',
+  '@angular/cdk',
+  '@schematics/angular',
+  'ng-packagr',
+];
+
+export async function fetchVersionsFromRegistry(
+  targetVersion: 'latest' | 'next'
+) {
+  console.log('⏳ - Fetching versions from registry...');
+  const packageVersionMap = new Map<string, string>();
+  for (const pkgName of packagesToUpdate) {
+    const response = await axios.get(`https://registry.npmjs.org/${pkgName}`);
+    const distTags = response.data['dist-tags'];
+    const latestVersion = distTags['latest'];
+    if (targetVersion === 'latest') {
+      packageVersionMap.set(pkgName, latestVersion);
+    } else {
+      const nextVersion = distTags['next'];
+      const coercedNextVersion = coerce(nextVersion) as SemVer;
+      // check which is the greater version
+      const versionToUse = gt(coercedNextVersion, latestVersion)
+        ? nextVersion
+        : latestVersion;
+      packageVersionMap.set(pkgName, versionToUse);
+    }
+  }
+  console.log(
+    `✅ - Fetched versions from registry (${packageVersionMap.get(
+      '@angular/cli'
+    )})`
+  );
+  return packageVersionMap;
+}

scripts/angular-support-upgrades/files/angular-cli-upgrade-migration.ts

@@ -0,0 +1,72 @@
+export const getAngularCliMigrationGenerator = (
+  version: string
+) => `import { formatFiles, Tree, updateJson } from '@nrwl/devkit';
+
+const angularCliVersion = '~${version}';
+
+export default async function (tree: Tree) {
+  let shouldFormat = false;
+
+  updateJson(tree, 'package.json', (json) => {
+    if (json.devDependencies?.['@angular/cli']) {
+      json.devDependencies['@angular/cli'] = angularCliVersion;
+      shouldFormat = true;
+    } else if (json.dependencies?.['@angular/cli']) {
+      json.dependencies['@angular/cli'] = angularCliVersion;
+      shouldFormat = true;
+    }
+
+    return json;
+  });
+
+  if (shouldFormat) {
+    await formatFiles(tree);
+  }
+}
+`;
+
+export const getAngularCliMigrationGeneratorSpec = (
+  version: string
+) => `import { readJson, Tree, writeJson } from '@nrwl/devkit';
+import { createTreeWithEmptyWorkspace } from '@nrwl/devkit/testing';
+import updateAngularCli from './update-angular-cli';
+
+describe('update-angular-cli migration', () => {
+  let tree: Tree;
+
+  beforeEach(() => {
+    tree = createTreeWithEmptyWorkspace({ layout: 'apps-libs' });
+  });
+
+  it('should update @angular/cli version when defined as a dev dependency', async () => {
+    writeJson(tree, 'package.json', {
+      devDependencies: { '@angular/cli': '~13.3.0' },
+    });
+
+    await updateAngularCli(tree);
+
+    const { devDependencies } = readJson(tree, 'package.json');
+    expect(devDependencies['@angular/cli']).toEqual('~${version}');
+  });
+
+  it('should update @angular/cli version when defined as a dependency', async () => {
+    writeJson(tree, 'package.json', {
+      dependencies: { '@angular/cli': '~13.3.0' },
+    });
+
+    await updateAngularCli(tree);
+
+    const { dependencies } = readJson(tree, 'package.json');
+    expect(dependencies['@angular/cli']).toEqual('~${version}');
+  });
+
+  it('should add @angular/cli to package.json when it is not set', async () => {
+    const initialPackageJson = readJson(tree, 'package.json');
+
+    await updateAngularCli(tree);
+
+    const packageJson = readJson(tree, 'package.json');
+    expect(packageJson).toStrictEqual(initialPackageJson);
+  });
+});
+`;

scripts/angular-support-upgrades/init-upgrade.ts

@@ -0,0 +1,44 @@
+#!/usr/bin/env node
+
+/**
+ * USAGE:
+ *
+ * Run the following command from the root of the workspace.
+ * Replace the versions with the correct target versions
+ *
+ * npx ts-node scripts/angular-support-upgrades/init-upgrade.ts --angularVersion=next --targetNxVersion=15.5.0 --targetNxMigrationVersion=15.5.0-beta.0
+ *
+ */
+import { fetchVersionsFromRegistry } from './fetch-versions-from-registry';
+import { updatePackageJsonForAngular } from './update-package-jsons';
+import { buildMigrations } from './build-migrations';
+import { updateVersionUtils } from './update-version-utils';
+
+const yargs = require('yargs/yargs');
+const { hideBin } = require('yargs/helpers');
+const argv = yargs(hideBin(process.argv)).argv;
+
+if (
+  !argv.angularVersion &&
+  !argv.targetNxVersion &&
+  !argv.targetNxMigrationVersion
+) {
+  throw new Error(
+    'You need to provide --angularVersion=(latest|next) and --targetNxVersion=versionString and --targetNxMigrationVersion=versionString'
+  );
+}
+
+async function run() {
+  const packageVersionMap = await fetchVersionsFromRegistry(
+    argv.angularVersion
+  );
+  await updatePackageJsonForAngular(packageVersionMap);
+  buildMigrations(
+    packageVersionMap,
+    argv.targetNxVersion,
+    argv.targetNxMigrationVersion
+  );
+  updateVersionUtils(packageVersionMap);
+}
+
+run();

scripts/angular-support-upgrades/update-package-jsons.ts

@@ -0,0 +1,46 @@
+import { readFileSync, writeFileSync } from 'fs';
+
+function updateRootPackageJson(packageVersionMap: Map<string, string>) {
+  const pathToPkgJson = 'package.json';
+  const pkgJson = JSON.parse(
+    readFileSync(pathToPkgJson, { encoding: 'utf-8' })
+  );
+
+  for (const [pkgName, version] of packageVersionMap.entries()) {
+    if (pkgJson.devDependencies && pkgJson.devDependencies[pkgName]) {
+      pkgJson.devDependencies[pkgName] = `~${version}`;
+    }
+    if (pkgJson.dependencies[pkgName]) {
+      pkgJson.dependencies[pkgName] = `~${version}`;
+    }
+  }
+
+  writeFileSync(pathToPkgJson, JSON.stringify(pkgJson, null, 2));
+}
+
+function updateAngularPackageJson(packageVersionMap: Map<string, string>) {
+  const pathToPkgJson = 'packages/angular/package.json';
+  const pkgJson = JSON.parse(
+    readFileSync(pathToPkgJson, { encoding: 'utf-8' })
+  );
+
+  for (const [pkgName, version] of packageVersionMap.entries()) {
+    if (pkgJson.devDependencies && pkgJson.devDependencies[pkgName]) {
+      pkgJson.devDependencies[pkgName] = `~${version}`;
+    }
+    if (pkgJson.dependencies && pkgJson.dependencies[pkgName]) {
+      pkgJson.dependencies[pkgName] = `~${version}`;
+    }
+  }
+
+  writeFileSync(pathToPkgJson, JSON.stringify(pkgJson, null, 2));
+}
+
+export async function updatePackageJsonForAngular(
+  packageVersionMap: Map<string, string>
+) {
+  console.log('⏳ - Writing package.json files...');
+  updateRootPackageJson(packageVersionMap);
+  updateAngularPackageJson(packageVersionMap);
+  console.log('✅ - Wrote package.json files');
+}

scripts/angular-support-upgrades/update-version-utils.ts

@@ -0,0 +1,61 @@
+import { readFileSync, writeFileSync } from 'fs';
+
+function updatAngularVersionUtils(packageVersionMap: Map<string, string>) {
+  const pathToFile = 'packages/angular/src/utils/versions.ts';
+  let versionUtilContents = readFileSync(pathToFile, { encoding: 'utf-8' });
+
+  const angularVersion = packageVersionMap.get('@angular/core') as string;
+  const angularDevkitVersion = packageVersionMap.get('@angular/cli') as string;
+  const ngPackagrVersion = packageVersionMap.get('ng-packagr') as string;
+
+  versionUtilContents = versionUtilContents.replace(
+    /export const angularVersion = '~(\d)+\.(\d)+\.(\d)+';/,
+    `export const angularVersion = '~${angularVersion}';`
+  );
+  versionUtilContents = versionUtilContents.replace(
+    /export const angularDevkitVersion = '~(\d)+\.(\d)+\.(\d)+';/,
+    `export const angularDevkitVersion = '~${angularDevkitVersion}';`
+  );
+  versionUtilContents = versionUtilContents.replace(
+    /export const ngPackagrVersion = '~(\d)+\.(\d)+\.(\d)+';/,
+    `export const ngPackagrVersion = '~${ngPackagrVersion}';`
+  );
+
+  writeFileSync(pathToFile, versionUtilContents);
+}
+function updatNxAngularVersionUtils(packageVersionMap: Map<string, string>) {
+  const pathToFile = 'packages/nx/src/utils/versions.ts';
+  let versionUtilContents = readFileSync(pathToFile, { encoding: 'utf-8' });
+
+  const angularDevkitVersion = packageVersionMap.get('@angular/cli') as string;
+
+  versionUtilContents = versionUtilContents.replace(
+    /export const angularCliVersion = '~(\d)+\.(\d)+\.(\d)+';/,
+    `export const angularCliVersion = '~${angularDevkitVersion}';`
+  );
+
+  writeFileSync(pathToFile, versionUtilContents);
+}
+function updatWorkspaceAngularVersionUtils(
+  packageVersionMap: Map<string, string>
+) {
+  const pathToFile = 'packages/workspace/src/utils/versions.ts';
+  let versionUtilContents = readFileSync(pathToFile, { encoding: 'utf-8' });
+
+  const angularDevkitVersion = packageVersionMap.get('@angular/cli') as string;
+
+  versionUtilContents = versionUtilContents.replace(
+    /export const angularCliVersion = '~(\d)+\.(\d)+\.(\d)+';/,
+    `export const angularCliVersion = '~${angularDevkitVersion}';`
+  );
+
+  writeFileSync(pathToFile, versionUtilContents);
+}
+
+export function updateVersionUtils(packageVersionMap: Map<string, string>) {
+  console.log('⏳ - Writing Util Files...');
+  updatAngularVersionUtils(packageVersionMap);
+  updatNxAngularVersionUtils(packageVersionMap);
+  updatWorkspaceAngularVersionUtils(packageVersionMap);
+  console.log('✅ - Wrote Util Files');
+}