From 3db2787ceaa9909a0f89035c4359a2738591918f Mon Sep 17 00:00:00 2001 From: Charles <19598772+clydin@users.noreply.github.com> Date: Wed, 14 Aug 2019 13:22:32 -0400 Subject: [PATCH] refactor(@angular-devkit/build-angular): update webpack typings (#15334) --- package.json | 4 +- .../plugins/webpack/analytics.ts | 3 +- .../models/webpack-configs/browser.ts | 8 ++-- .../models/webpack-configs/common.ts | 4 +- .../models/webpack-configs/server.ts | 2 +- .../models/webpack-configs/test.ts | 4 +- .../plugins/cleancss-webpack-plugin.ts | 43 +++++++++---------- .../plugins/index-html-webpack-plugin.ts | 4 +- .../build_angular/src/dev-server/index.ts | 30 ++++++------- .../src/webpack-dev-server/index.ts | 2 +- yarn.lock | 31 +++++++++---- 11 files changed, 70 insertions(+), 65 deletions(-) diff --git a/package.json b/package.json index ce13dd36b9..9a75b7ca2e 100644 --- a/package.json +++ b/package.json @@ -101,8 +101,8 @@ "@types/node": "10.9.4", "@types/request": "^2.47.1", "@types/semver": "^6.0.0", - "@types/webpack": "^4.4.11", - "@types/webpack-dev-server": "^3.1.0", + "@types/webpack": "^4.32.1", + "@types/webpack-dev-server": "^3.1.7", "@types/webpack-sources": "^0.1.5", "@yarnpkg/lockfile": "1.1.0", "ajv": "6.10.2", diff --git a/packages/angular_devkit/build_angular/plugins/webpack/analytics.ts b/packages/angular_devkit/build_angular/plugins/webpack/analytics.ts index 509c8a1d18..94f76d36e4 100644 --- a/packages/angular_devkit/build_angular/plugins/webpack/analytics.ts +++ b/packages/angular_devkit/build_angular/plugins/webpack/analytics.ts @@ -13,7 +13,6 @@ import { compilation, } from 'webpack'; import { Source } from 'webpack-sources'; -import Compilation = compilation.Compilation; const NormalModule = require('webpack/lib/NormalModule'); @@ -262,7 +261,7 @@ export class NgBuildAnalyticsPlugin { } } - protected _compilation(compiler: Compiler, compilation: Compilation) { + protected _compilation(compiler: Compiler, compilation: compilation.Compilation) { this._reset(); compilation.hooks.succeedModule.tap('NgBuildAnalyticsPlugin', this._succeedModule.bind(this)); } diff --git a/packages/angular_devkit/build_angular/src/angular-cli-files/models/webpack-configs/browser.ts b/packages/angular_devkit/build_angular/src/angular-cli-files/models/webpack-configs/browser.ts index 456c9591c2..36dd096b71 100644 --- a/packages/angular_devkit/build_angular/src/angular-cli-files/models/webpack-configs/browser.ts +++ b/packages/angular_devkit/build_angular/src/angular-cli-files/models/webpack-configs/browser.ts @@ -78,12 +78,12 @@ export function getBrowserConfig(wco: WebpackConfigOptions): webpack.Configurati splitChunks: { maxAsyncRequests: Infinity, cacheGroups: { - default: buildOptions.commonChunk && { + default: !!buildOptions.commonChunk && { chunks: 'async', minChunks: 2, priority: 10, }, - common: buildOptions.commonChunk && { + common: !!buildOptions.commonChunk && { name: 'common', chunks: 'async', minChunks: 2, @@ -91,7 +91,7 @@ export function getBrowserConfig(wco: WebpackConfigOptions): webpack.Configurati priority: 5, }, vendors: false, - vendor: buildOptions.vendorChunk && { + vendor: !!buildOptions.vendorChunk && { name: 'vendor', chunks: 'initial', enforce: true, @@ -105,7 +105,7 @@ export function getBrowserConfig(wco: WebpackConfigOptions): webpack.Configurati }, }, }, - } as webpack.Options.Optimization, + }, plugins: extraPlugins, node: false, }; diff --git a/packages/angular_devkit/build_angular/src/angular-cli-files/models/webpack-configs/common.ts b/packages/angular_devkit/build_angular/src/angular-cli-files/models/webpack-configs/common.ts index 760bee2b2c..b17c42fcc4 100644 --- a/packages/angular_devkit/build_angular/src/angular-cli-files/models/webpack-configs/common.ts +++ b/packages/angular_devkit/build_angular/src/angular-cli-files/models/webpack-configs/common.ts @@ -18,7 +18,6 @@ import { Configuration, ContextReplacementPlugin, HashedModuleIdsPlugin, - Output, debug, } from 'webpack'; import { RawSource } from 'webpack-sources'; @@ -408,8 +407,7 @@ export function getCommonConfig(wco: WebpackConfigOptions): Configuration { path: path.resolve(root, buildOptions.outputPath as string), publicPath: buildOptions.deployUrl, filename: `[name]${targetInFileName}${hashFormat.chunk}.js`, - // cast required until typings include `futureEmitAssets` property - } as Output, + }, watch: buildOptions.watch, watchOptions: { poll: buildOptions.poll, diff --git a/packages/angular_devkit/build_angular/src/angular-cli-files/models/webpack-configs/server.ts b/packages/angular_devkit/build_angular/src/angular-cli-files/models/webpack-configs/server.ts index 370eed3175..6079bf1c16 100644 --- a/packages/angular_devkit/build_angular/src/angular-cli-files/models/webpack-configs/server.ts +++ b/packages/angular_devkit/build_angular/src/angular-cli-files/models/webpack-configs/server.ts @@ -14,7 +14,7 @@ import { getSourceMapDevTool } from './utils'; * Returns a partial specific to creating a bundle for node * @param wco Options which are include the build options and app config */ -export function getServerConfig(wco: WebpackConfigOptions) { +export function getServerConfig(wco: WebpackConfigOptions): Configuration { const extraPlugins = []; if (wco.buildOptions.sourceMap) { const { scripts, styles, hidden } = wco.buildOptions.sourceMap; diff --git a/packages/angular_devkit/build_angular/src/angular-cli-files/models/webpack-configs/test.ts b/packages/angular_devkit/build_angular/src/angular-cli-files/models/webpack-configs/test.ts index 8c9566b633..6e51b322ce 100644 --- a/packages/angular_devkit/build_angular/src/angular-cli-files/models/webpack-configs/test.ts +++ b/packages/angular_devkit/build_angular/src/angular-cli-files/models/webpack-configs/test.ts @@ -101,7 +101,5 @@ export function getTestConfig( }, }, }, - // Webpack typings don't yet include the function form for 'chunks', - // or the built-in vendors cache group. - } as {} as webpack.Configuration; + }; } diff --git a/packages/angular_devkit/build_angular/src/angular-cli-files/plugins/cleancss-webpack-plugin.ts b/packages/angular_devkit/build_angular/src/angular-cli-files/plugins/cleancss-webpack-plugin.ts index 6132bcd52e..1438f73141 100644 --- a/packages/angular_devkit/build_angular/src/angular-cli-files/plugins/cleancss-webpack-plugin.ts +++ b/packages/angular_devkit/build_angular/src/angular-cli-files/plugins/cleancss-webpack-plugin.ts @@ -1,6 +1,3 @@ -// tslint:disable -// TODO: cleanup this file, it's copied as is from Angular CLI. - /** * @license * Copyright Google Inc. All Rights Reserved. @@ -8,30 +5,30 @@ * Use of this source code is governed by an MIT-style license that can be * found in the LICENSE file at https://angular.io/license */ - import * as CleanCSS from 'clean-css'; import { Compiler, compilation } from 'webpack'; import { RawSource, Source, SourceMapSource } from 'webpack-sources'; -interface Chunk { - files: string[]; -} - export interface CleanCssWebpackPluginOptions { sourceMap: boolean; test: (file: string) => boolean; } function hook( - compiler: any, - action: (compilation: any, chunks: Array) => Promise, + compiler: Compiler, + action: ( + compilation: compilation.Compilation, + chunks: compilation.Chunk[], + ) => Promise, ) { - compiler.hooks.compilation.tap('cleancss-webpack-plugin', (compilation: any) => { - compilation.hooks.optimizeChunkAssets.tapPromise( - 'cleancss-webpack-plugin', - (chunks: Array) => action(compilation, chunks), - ); - }); + compiler.hooks.compilation.tap( + 'cleancss-webpack-plugin', + (compilation: compilation.Compilation) => { + compilation.hooks.optimizeChunkAssets.tapPromise('cleancss-webpack-plugin', chunks => + action(compilation, chunks), + ); + }, + ); } export class CleanCssWebpackPlugin { @@ -40,13 +37,13 @@ export class CleanCssWebpackPlugin { constructor(options: Partial) { this._options = { sourceMap: false, - test: (file) => file.endsWith('.css'), + test: file => file.endsWith('.css'), ...options, }; } apply(compiler: Compiler): void { - hook(compiler, (compilation: compilation.Compilation, chunks: Array) => { + hook(compiler, (compilation: compilation.Compilation, chunks: compilation.Chunk[]) => { const cleancss = new CleanCSS({ compatibility: 'ie9', level: { @@ -54,8 +51,8 @@ export class CleanCssWebpackPlugin { skipProperties: [ 'transition', // Fixes #12408 'font', // Fixes #9648 - ] - } + ], + }, }, inline: false, returnPromise: true, @@ -79,6 +76,7 @@ export class CleanCssWebpackPlugin { } let content: string; + // tslint:disable-next-line: no-any let map: any; if (this._options.sourceMap && asset.sourceAndMap) { const sourceAndMap = asset.sourceAndMap(); @@ -101,8 +99,8 @@ export class CleanCssWebpackPlugin { } if (output.errors && output.errors.length > 0) { - output.errors - .forEach((error: string) => compilation.errors.push(new Error(error))); + output.errors.forEach((error: string) => compilation.errors.push(new Error(error))); + return; } @@ -116,6 +114,7 @@ export class CleanCssWebpackPlugin { newSource = new SourceMapSource( output.styles, file, + // tslint:disable-next-line: no-any output.sourceMap.toString() as any, content, map, diff --git a/packages/angular_devkit/build_angular/src/angular-cli-files/plugins/index-html-webpack-plugin.ts b/packages/angular_devkit/build_angular/src/angular-cli-files/plugins/index-html-webpack-plugin.ts index 7542d41787..eff0ba5af8 100644 --- a/packages/angular_devkit/build_angular/src/angular-cli-files/plugins/index-html-webpack-plugin.ts +++ b/packages/angular_devkit/build_angular/src/angular-cli-files/plugins/index-html-webpack-plugin.ts @@ -62,9 +62,7 @@ export class IndexHtmlWebpackPlugin { compiler.hooks.emit.tapPromise('index-html-webpack-plugin', async compilation => { // Get input html file const inputContent = await readFile(this._options.input, compilation); - (compilation as compilation.Compilation & { - fileDependencies: Set; - }).fileDependencies.add(this._options.input); + compilation.fileDependencies.add(this._options.input); // Get all files for selected entrypoints const files: FileInfo[] = []; diff --git a/packages/angular_devkit/build_angular/src/dev-server/index.ts b/packages/angular_devkit/build_angular/src/dev-server/index.ts index cbb7f4297d..8bcd13a107 100644 --- a/packages/angular_devkit/build_angular/src/dev-server/index.ts +++ b/packages/angular_devkit/build_angular/src/dev-server/index.ts @@ -315,19 +315,17 @@ export function buildServerConfig( host: serverOptions.host, port: serverOptions.port, headers: { 'Access-Control-Allow-Origin': '*' }, - historyApiFallback: - !!browserOptions.index && - ({ - index: `${servePath}/${getIndexOutputFile(browserOptions)}`, - disableDotRule: true, - htmlAcceptHeaders: ['text/html', 'application/xhtml+xml'], - rewrites: [ - { - from: new RegExp(`^(?!${servePath})/.*`), - to: context => url.format(context.parsedUrl), - }, - ], - } as WebpackDevServer.HistoryApiFallbackConfig), + historyApiFallback: !!browserOptions.index && { + index: `${servePath}/${getIndexOutputFile(browserOptions)}`, + disableDotRule: true, + htmlAcceptHeaders: ['text/html', 'application/xhtml+xml'], + rewrites: [ + { + from: new RegExp(`^(?!${servePath})/.*`), + to: context => url.format(context.parsedUrl), + }, + ], + }, stats: false, compress: styles || scripts, watchOptions: { @@ -434,8 +432,8 @@ function _addLiveReload( // This adds it back so that behavior is consistent when using a custom URL path let sockjsPath = ''; if (clientAddress.pathname) { - clientAddress.pathname = path.posix.join(clientAddress.pathname, 'sockjs-node'); - sockjsPath = '&sockPath=' + clientAddress.pathname; + clientAddress.pathname = path.posix.join(clientAddress.pathname, 'sockjs-node'); + sockjsPath = '&sockPath=' + clientAddress.pathname; } const entryPoints = [`${webpackDevServerPath}?${url.format(clientAddress)}${sockjsPath}`]; @@ -465,7 +463,7 @@ function _addLiveReload( } } if (typeof webpackConfig.entry !== 'object' || Array.isArray(webpackConfig.entry)) { - webpackConfig.entry = {} as webpack.Entry; + webpackConfig.entry = {}; } if (!Array.isArray(webpackConfig.entry.main)) { webpackConfig.entry.main = []; diff --git a/packages/angular_devkit/build_webpack/src/webpack-dev-server/index.ts b/packages/angular_devkit/build_webpack/src/webpack-dev-server/index.ts index c1fd3c1575..c78b0c9da2 100644 --- a/packages/angular_devkit/build_webpack/src/webpack-dev-server/index.ts +++ b/packages/angular_devkit/build_webpack/src/webpack-dev-server/index.ts @@ -47,7 +47,7 @@ export function runWebpackDevServer( const devServerConfig = options.devServerConfig || config.devServer || {}; if (devServerConfig.stats) { - config.stats = devServerConfig.stats as webpack.Stats.ToStringOptionsObject; + config.stats = devServerConfig.stats; } // Disable stats reporting by the devserver, we have our own logger. devServerConfig.stats = false; diff --git a/yarn.lock b/yarn.lock index 631c7d8692..b3ed96664c 100644 --- a/yarn.lock +++ b/yarn.lock @@ -935,6 +935,11 @@ dependencies: defer-to-connect "^1.0.1" +"@types/anymatch@*": + version "1.3.1" + resolved "https://registry.yarnpkg.com/@types/anymatch/-/anymatch-1.3.1.tgz#336badc1beecb9dacc38bea2cf32adf627a8421a" + integrity sha512-/+CRPXpBDpo2RK9C68N3b2cOvO0Cf5B9aPijHsoDQTHivnGSObdOF2BRQOYjojWTDy6nQvMjmqRXIxH55VjxxA== + "@types/bluebird@*": version "3.5.26" resolved "https://registry.yarnpkg.com/@types/bluebird/-/bluebird-3.5.26.tgz#a38c438ae84fa02431d6892edf86e46edcbca291" @@ -970,6 +975,14 @@ dependencies: "@types/node" "*" +"@types/connect-history-api-fallback@*": + version "1.3.2" + resolved "https://registry.yarnpkg.com/@types/connect-history-api-fallback/-/connect-history-api-fallback-1.3.2.tgz#40a497500238ebf30ae28fdf687c2f92969f2635" + integrity sha512-tobKLYh5XszXIQ2lHTeyK1wMi/3K5WiOKb/sl6MENCirlOcXw0jUBHHmST2dLKnYMv6WHWPOSmR8jIF3za0MBQ== + dependencies: + "@types/express-serve-static-core" "*" + "@types/node" "*" + "@types/connect@*": version "3.4.32" resolved "https://registry.yarnpkg.com/@types/connect/-/connect-3.4.32.tgz#aa0e9616b9435ccad02bc52b5b454ffc2c70ba28" @@ -1327,11 +1340,12 @@ dependencies: "@types/node" "*" -"@types/webpack-dev-server@^3.1.0": - version "3.1.0" - resolved "https://registry.yarnpkg.com/@types/webpack-dev-server/-/webpack-dev-server-3.1.0.tgz#1fae06ad346d2dd09bc5e34745723946458eed58" - integrity sha512-nutifgcFiPP3I/+mPWlZCsQNKpWNUGm6qjAMfleZuPfPfybXWymHvlcYsKvg+NPedSkrNh0vu2xKAlak/l+pOg== +"@types/webpack-dev-server@^3.1.7": + version "3.1.7" + resolved "https://registry.yarnpkg.com/@types/webpack-dev-server/-/webpack-dev-server-3.1.7.tgz#a3e7a20366e68bc9853c730b56e994634cb78dac" + integrity sha512-VIRkDkBDuOkYRXQ1EG/etisQ3odo6pcjSmA1Si4VYANuNhSBsLxfuPGeGERwCx1nDKxK3aaXnicPzi0gUvxUaw== dependencies: + "@types/connect-history-api-fallback" "*" "@types/express" "*" "@types/http-proxy-middleware" "*" "@types/serve-static" "*" @@ -1346,11 +1360,12 @@ "@types/source-list-map" "*" source-map "^0.6.1" -"@types/webpack@*", "@types/webpack@^4.4.11": - version "4.4.11" - resolved "https://registry.yarnpkg.com/@types/webpack/-/webpack-4.4.11.tgz#0ca832870d55c4e92498c01d22d00d02b0f62ae9" - integrity sha512-NdESmbpvVEtJgs15kyZYKr5ouLYPMYt9DNG5JEgCekbG/ezFLPCzf4XcAv8caOb+b7x6ieAuSt0eoR0UkSI7RA== +"@types/webpack@*", "@types/webpack@^4.32.1": + version "4.32.1" + resolved "https://registry.yarnpkg.com/@types/webpack/-/webpack-4.32.1.tgz#6e95010e806f808abd6551c112097ac09035aacf" + integrity sha512-9n38CBx9uga1FEAdTipnt0EkbKpsCJFh7xJb1LE65FFb/A6OOLFX022vYsGC1IyVCZ/GroNg9u/RMmlDxGcLIw== dependencies: + "@types/anymatch" "*" "@types/node" "*" "@types/tapable" "*" "@types/uglify-js" "*"