feat(@angular-devkit/build-angular): remove deprecated dev-server options

alan-agius4 · filipesilva · commit 000b0e51c166 · 2021-10-01T14:07:42.000-05:00
BREAKING CHANGE: With this change a number of deprecated dev-server builder options which proxied to the browser builder have been removed. These options should be configured in the browser builder instead.

The removed options are:
- `aot`
- `sourceMap`
- `deployUrl`
- `baseHref`
- `vendorChunk`
- `commonChunk`
- `optimization`
- `progress`
diff --git a/goldens/public-api/angular_devkit/build_angular/src/index.md b/goldens/public-api/angular_devkit/build_angular/src/index.md
@@ -193,7 +193,7 @@ export interface KarmaBuilderOptions {
     progress?: boolean;
     reporters?: string[];
     scripts?: ExtraEntryPoint_2[];
-    sourceMap?: SourceMapUnion_3;
+    sourceMap?: SourceMapUnion_2;
     stylePreprocessorOptions?: StylePreprocessorOptions_2;
     styles?: ExtraEntryPoint_2[];
     tsConfig: string;
@@ -264,7 +264,7 @@ export interface ServerBuilderOptions {
     localize?: Localize_2;
     main: string;
     namedChunks?: boolean;
-    optimization?: OptimizationUnion_3;
+    optimization?: OptimizationUnion_2;
     outputHashing?: OutputHashing_2;
     outputPath: string;
     poll?: number;
@@ -273,7 +273,7 @@ export interface ServerBuilderOptions {
     resourcesOutputPath?: string;
     // @deprecated
     showCircularDependencies?: boolean;
-    sourceMap?: SourceMapUnion_4;
+    sourceMap?: SourceMapUnion_3;
     statsJson?: boolean;
     stylePreprocessorOptions?: StylePreprocessorOptions_3;
     tsConfig: string;
diff --git a/packages/angular_devkit/build_angular/src/builders/dev-server/index.ts b/packages/angular_devkit/build_angular/src/builders/dev-server/index.ts
@@ -50,38 +50,6 @@ import { Schema } from './schema';
 
 export type DevServerBuilderOptions = Schema & json.JsonObject;
 
-const devServerBuildOverriddenKeys: (keyof DevServerBuilderOptions)[] = [
-  'watch',
-  'optimization',
-  'aot',
-  'sourceMap',
-  'vendorChunk',
-  'commonChunk',
-  'baseHref',
-  'progress',
-  'poll',
-  'verbose',
-  'deployUrl',
-];
-
-// Get dev-server only options.
-type DevServerOptions = Partial<
-  Omit<
-    Schema,
-    | 'watch'
-    | 'optimization'
-    | 'aot'
-    | 'sourceMap'
-    | 'vendorChunk'
-    | 'commonChunk'
-    | 'baseHref'
-    | 'progress'
-    | 'poll'
-    | 'verbose'
-    | 'deployUrl'
-  >
->;
-
 /**
  * @experimental Direct usage of this type is considered experimental.
  */
@@ -120,42 +88,8 @@ export function serveWebpackBrowser(
     projectRoot: string;
     locale: string | undefined;
   }> {
-    // Get the browser configuration from the target name.
-    const rawBrowserOptions = (await context.getTargetOptions(browserTarget)) as json.JsonObject &
-      BrowserBuilderSchema;
     options.port = await checkPort(options.port ?? 4200, options.host || 'localhost');
 
-    // Override options we need to override, if defined.
-    const overrides = (Object.keys(options) as (keyof DevServerBuilderOptions)[])
-      .filter((key) => options[key] !== undefined && devServerBuildOverriddenKeys.includes(key))
-      .reduce<json.JsonObject & Partial<BrowserBuilderSchema>>(
-        (previous, key) => ({
-          ...previous,
-          [key]: options[key],
-        }),
-        {},
-      );
-
-    const devServerOptions: DevServerOptions = (Object.keys(options) as (keyof Schema)[])
-      .filter((key) => !devServerBuildOverriddenKeys.includes(key) && key !== 'browserTarget')
-      .reduce<DevServerOptions>(
-        (previous, key) => ({
-          ...previous,
-          [key]: options[key],
-        }),
-        {},
-      );
-
-    // In dev server we should not have budgets because of extra libs such as socks-js
-    overrides.budgets = undefined;
-
-    if (rawBrowserOptions.outputHashing && rawBrowserOptions.outputHashing !== OutputHashing.None) {
-      // Disable output hashing for dev build as this can cause memory leaks
-      // See: https://github.com/webpack/webpack-dev-server/issues/377#issuecomment-241258405
-      overrides.outputHashing = OutputHashing.None;
-      logger.warn(`Warning: 'outputHashing' option is disabled when using the dev-server.`);
-    }
-
     if (options.hmr) {
       logger.warn(tags.stripIndents`NOTICE: Hot Module Replacement (HMR) is enabled for the dev server.
       See https://webpack.js.org/guides/hot-module-replacement for information on working with HMR for Webpack.`);
@@ -185,14 +119,26 @@ export function serveWebpackBrowser(
         for more information.
       `);
     }
+    // Get the browser configuration from the target name.
+    const rawBrowserOptions = (await context.getTargetOptions(browserTarget)) as json.JsonObject &
+      BrowserBuilderSchema;
 
-    // Webpack's live reload functionality adds the `strip-ansi` package which is commonJS
-    rawBrowserOptions.allowedCommonJsDependencies ??= [];
-    rawBrowserOptions.allowedCommonJsDependencies.push('strip-ansi');
+    if (rawBrowserOptions.outputHashing && rawBrowserOptions.outputHashing !== OutputHashing.None) {
+      // Disable output hashing for dev build as this can cause memory leaks
+      // See: https://github.com/webpack/webpack-dev-server/issues/377#issuecomment-241258405
+      rawBrowserOptions.outputHashing = OutputHashing.None;
+      logger.warn(`Warning: 'outputHashing' option is disabled when using the dev-server.`);
+    }
 
     const browserName = await context.getBuilderNameForTarget(browserTarget);
     const browserOptions = (await context.validateOptions(
-      { ...rawBrowserOptions, ...overrides },
+      {
+        ...rawBrowserOptions,
+        watch: options.watch,
+        verbose: options.verbose,
+        // In dev server we should not have budgets because of extra libs such as socks-js
+        budgets: undefined,
+      } as json.JsonObject & BrowserBuilderSchema,
       browserName,
     )) as json.JsonObject & BrowserBuilderSchema;
 
@@ -221,7 +167,7 @@ export function serveWebpackBrowser(
         getTypeScriptConfig(wco),
         browserOptions.webWorkerTsConfig ? getWorkerConfig(wco) : {},
       ],
-      devServerOptions,
+      options,
     );
 
     if (!config.devServer) {
diff --git a/packages/angular_devkit/build_angular/src/builders/dev-server/schema.json b/packages/angular_devkit/build_angular/src/builders/dev-server/schema.json
@@ -92,98 +92,6 @@
       "description": "Rebuild on change.",
       "default": true
     },
-    "optimization": {
-      "description": "Enables optimization of the build output. Including minification of scripts and styles, tree-shaking, dead-code elimination, tree-shaking and fonts inlining. For more information, see https://angular.io/guide/workspace-config#optimization-configuration.",
-      "x-user-analytics": 16,
-      "oneOf": [
-        {
-          "type": "object",
-          "properties": {
-            "scripts": {
-              "type": "boolean",
-              "description": "Enables optimization of the scripts output.",
-              "default": true
-            },
-            "styles": {
-              "type": "boolean",
-              "description": "Enables optimization of the styles output.",
-              "default": true
-            }
-          },
-          "additionalProperties": false
-        },
-        {
-          "type": "boolean"
-        }
-      ],
-      "x-deprecated": "Use the \"optimization\" option in the browser builder instead."
-    },
-    "aot": {
-      "type": "boolean",
-      "description": "Build using Ahead of Time compilation.",
-      "x-user-analytics": 13,
-      "x-deprecated": "Use the \"aot\" option in the browser builder instead."
-    },
-    "sourceMap": {
-      "description": "Output source maps for scripts and styles. For more information, see https://angular.io/guide/workspace-config#source-map-configuration.",
-      "oneOf": [
-        {
-          "type": "object",
-          "properties": {
-            "scripts": {
-              "type": "boolean",
-              "description": "Output source maps for all scripts.",
-              "default": true
-            },
-            "styles": {
-              "type": "boolean",
-              "description": "Output source maps for all styles.",
-              "default": true
-            },
-            "hidden": {
-              "type": "boolean",
-              "description": "Output source maps used for error reporting tools.",
-              "default": false
-            },
-            "vendor": {
-              "type": "boolean",
-              "description": "Resolve vendor packages source maps.",
-              "default": false
-            }
-          },
-          "additionalProperties": false
-        },
-        {
-          "type": "boolean"
-        }
-      ],
-      "x-deprecated": "Use the \"sourceMap\" option in the browser builder instead."
-    },
-    "vendorChunk": {
-      "type": "boolean",
-      "description": "Generate a seperate bundle containing only vendor libraries. This option should only used for development.",
-      "x-deprecated": "Use the \"vendorChunk\" option in the browser builder instead."
-    },
-    "commonChunk": {
-      "type": "boolean",
-      "description": "Generate a seperate bundle containing code used across multiple bundles.",
-      "x-deprecated": "Use the \"commonChunk\" option in the browser builder instead."
-    },
-    "baseHref": {
-      "type": "string",
-      "description": "Base url for the application being built.",
-      "x-deprecated": "Use the \"baseHref\" option in the browser builder instead."
-    },
-    "deployUrl": {
-      "type": "string",
-      "description": "URL where files will be deployed.",
-      "x-deprecated": "Use the \"deployUrl\" option in the browser builder instead."
-    },
-    "progress": {
-      "type": "boolean",
-      "description": "Log progress to the console while building.",
-      "x-deprecated": "Use the \"progress\" option in the browser builder instead."
-    },
     "poll": {
       "type": "number",
       "description": "Enable and define the file watching poll time period in milliseconds."
diff --git a/packages/schematics/angular/migrations/update-13/update-angular-config.ts b/packages/schematics/angular/migrations/update-13/update-angular-config.ts
@@ -16,18 +16,24 @@ export default function (): Rule {
         // Delete removed tslint builder
         if (target.builder === '@angular-devkit/build-angular:tslint') {
           project.targets.delete(name);
-          continue;
-        }
-
-        if (!target.builder.startsWith('@angular-devkit/build-angular')) {
-          continue;
-        }
-
-        // Only interested in Angular Devkit builders
-        for (const [, options] of allTargetOptions(target)) {
-          delete options.extractCss;
-          delete options.servePathDefaultWarning;
-          delete options.hmrWarning;
+        } else if (target.builder === '@angular-devkit/build-angular:dev-server') {
+          for (const [, options] of allTargetOptions(target)) {
+            delete options.optimization;
+            delete options.aot;
+            delete options.progress;
+            delete options.deployUrl;
+            delete options.sourceMap;
+            delete options.vendorChunk;
+            delete options.commonChunk;
+            delete options.baseHref;
+            delete options.servePathDefaultWarning;
+            delete options.hmrWarning;
+          }
+        } else if (target.builder.startsWith('@angular-devkit/build-angular')) {
+          // Only interested in Angular Devkit builders
+          for (const [, options] of allTargetOptions(target)) {
+            delete options.extractCss;
+          }
         }
       }
     }
