Graham/angular-cli
1
0
Fork 0
mirror of https://github.com/angular/angular-cli.git synced 2025-05-25 16:57:51 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(@angular-devkit/build-angular): fixed afterOptimizeChunkAssets is deprecated in webpack 5

Browse Source
This commit is contained in:
Dmitriy Shekhovtsov 2020-09-28 15:15:05 +03:00 committed by Alan Agius
parent defc8f562d
commit 38023fe41c
1 changed files with 22 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
packages/angular_devkit/build_angular/src/webpack/plugins/any-component-style-budget-checker.ts
View File

@ -11,6 +11,7 @@ import { Compiler } from 'webpack';
import { Budget, Type } from '../../browser/schema';
import { ThresholdSeverity, calculateThresholds, checkThresholds } from '../../utils/bundle-calculator';
import { addError, addWarning } from '../../utils/webpack-diagnostics';
import { isWebpackFiveOrHigher } from '../../utils/webpack-version';
const PLUGIN_NAME = 'AnyComponentStyleBudgetChecker';
@ -20,13 +21,14 @@ const PLUGIN_NAME = 'AnyComponentStyleBudgetChecker';
*/
export class AnyComponentStyleBudgetChecker {
private readonly budgets: Budget[];
constructor(budgets: Budget[]) {
this.budgets = budgets.filter((budget) => budget.type === Type.AnyComponentStyle);
}
apply(compiler: Compiler) {
compiler.hooks.compilation.tap(PLUGIN_NAME, (compilation) => {
compilation.hooks.afterOptimizeChunkAssets.tap(PLUGIN_NAME, () => {
const afterOptimizeChunkAssets = () => {
// In AOT compilations component styles get processed in child compilations.
// tslint:disable-next-line: no-any
const parentCompilation = (compilation.compiler as any).parentCompilation;
@ -43,15 +45,15 @@ export class AnyComponentStyleBudgetChecker {
];
const componentStyles = Object.keys(compilation.assets)
.filter((name) => cssExtensions.includes(path.extname(name)))
.map((name) => ({
size: compilation.assets[name].size(),
label: name,
}));
.filter((name) => cssExtensions.includes(path.extname(name)))
.map((name) => ({
size: compilation.assets[name].size(),
label: name,
}));
const thresholds = flatMap(this.budgets, (budget) => calculateThresholds(budget));
for (const { size, label } of componentStyles) {
for (const { severity, message } of checkThresholds(thresholds[Symbol.iterator](), size, label)) {
for (const {size, label} of componentStyles) {
for (const {severity, message} of checkThresholds(thresholds[Symbol.iterator](), size, label)) {
switch (severity) {
case ThresholdSeverity.Warning:
addWarning(compilation, message);
@ -65,7 +67,18 @@ export class AnyComponentStyleBudgetChecker {
}
}
}
});
};
if (isWebpackFiveOrHigher()) {
// webpack 5 migration "guide"
// https://github.com/webpack/webpack/blob/07fc554bef5930f8577f91c91a8b81791fc29746/lib/Compilation.js#L535-L539
// TODO_WEBPACK_5 const stage = Compilation.PROCESS_ASSETS_STAGE_OPTIMIZE + 1;
const stage = 101;
// tslint:disable-next-line: no-any
(compilation.hooks as any).processAssets.tap({name: PLUGIN_NAME, stage}, afterOptimizeChunkAssets);
} else {
compilation.hooks.afterOptimizeChunkAssets.tap(PLUGIN_NAME, afterOptimizeChunkAssets);
}
});
}
}