From 000b0e51c166ecd26b6f24d6a133ea5076df9849 Mon Sep 17 00:00:00 2001 From: Alan Agius Date: Wed, 29 Sep 2021 15:25:38 +0200 Subject: [PATCH] feat(@angular-devkit/build-angular): remove deprecated dev-server options 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` --- .../angular_devkit/build_angular/src/index.md | 6 +- .../src/builders/dev-server/index.ts | 88 ++++-------------- .../src/builders/dev-server/schema.json | 92 ------------------- .../update-13/update-angular-config.ts | 30 +++--- 4 files changed, 38 insertions(+), 178 deletions(-) diff --git a/goldens/public-api/angular_devkit/build_angular/src/index.md b/goldens/public-api/angular_devkit/build_angular/src/index.md index 9b4b0895f99c..f979056de152 100644 --- 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 index 093da839a749..61d36e9852c4 100644 --- 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>( - (previous, key) => ({ - ...previous, - [key]: options[key], - }), - {}, - ); - - const devServerOptions: DevServerOptions = (Object.keys(options) as (keyof Schema)[]) - .filter((key) => !devServerBuildOverriddenKeys.includes(key) && key !== 'browserTarget') - .reduce( - (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 index 9134d9a8930c..f5316f383b84 100644 --- 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 index fd7d98daf5bb..79e88717d644 100644 --- 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; + } } } }