[Angular 12] The 'compilation' argument must be an instance of Compilation (Webpack 5) / webpack_1.util.cleverMerge is not a function (Webpack 4)

[buu700]

Bug Report

Affected Package

Seems like an issue with @angular-devkit/build-angular and/or @ngtools/webpack and/or @angular/compiler-cli?

Is this a regression?

Yes, the behavior was not reproducible with Angular 11 and webpack 4.

Description

Attempting to build (ng build --aot true --common-chunk false --source-map false --vendor-chunk false) fails with the error below.

Minimal Reproduction

I can investigate further and try to put something together if needed, but our project code is at least available at https://github.com/cyph/cyph/tree/angular-42087-test.

Exception or Error

Angular 12 with Webpack 5:

⠋ Generating browser application bundles...Warning: Entry point 'devextreme-angular/ui/file-manager' contains deep imports into '/cyph/cyph.app/node_modules/devextreme/ui/file_manager', '/cyph/cyph.app/node_modules/devextreme/bundles/dx.all'. This is probably not a problem, but may cause the compilation of entry points to be out of order.
Warning: Entry point 'angular2-text-mask' contains deep imports into '/cyph/cyph.app/node_modules/text-mask-core/dist/textMaskCore'. This is probably not a problem, but may cause the compilation of entry points to be out of order.
Warning: Entry point 'devextreme-angular/core' contains deep imports into '/cyph/cyph.app/node_modules/devextreme/core/utils/common', '/cyph/cyph.app/node_modules/devextreme/core/dom_adapter', '/cyph/cyph.app/node_modules/devextreme/events', '/cyph/cyph.app/node_modules/devextreme/core/renderer', '/cyph/cyph.app/node_modules/devextreme/core/http_request', '/cyph/cyph.app/node_modules/devextreme/core/utils/ready_callbacks', '/cyph/cyph.app/node_modules/devextreme/events/core/events_engine', '/cyph/cyph.app/node_modules/devextreme/core/utils/ajax', '/cyph/cyph.app/node_modules/devextreme/core/utils/deferred'. This is probably not a problem, but may cause the compilation of entry points to be out of order.
Warning: Entry point 'devextreme-angular/ui/nested' contains deep imports into '/cyph/cyph.app/node_modules/devextreme/bundles/dx.all', '/cyph/cyph.app/node_modules/devextreme/animation/fx', '/cyph/cyph.app/node_modules/devextreme/viz/core/base_widget', '/cyph/cyph.app/node_modules/devextreme/ui/widget/ui.widget', '/cyph/cyph.app/node_modules/devextreme/ui/box', '/cyph/cyph.app/node_modules/devextreme/ui/button', '/cyph/cyph.app/node_modules/devextreme/ui/tab_panel', '/cyph/cyph.app/node_modules/devextreme/ui/form', '/cyph/cyph.app/node_modules/devextreme/data/abstract_store', '/cyph/cyph.app/node_modules/devextreme/ui/pivot_grid/xmla_store', '/cyph/cyph.app/node_modules/devextreme/ui/popup'. This is probably not a problem, but may cause the compilation of entry points to be out of order.
(node:320) UnhandledPromiseRejectionWarning: TypeError: The 'compilation' argument must be an instance of Compilation
    at getCompilationHooks (/cyph/cyph.app/node_modules/webpack/lib/javascript/JavascriptModulesPlugin.js:125:10)
    at /cyph/cyph.app/node_modules/webpack/lib/javascript/CommonJsChunkFormatPlugin.js:43:19
    at Hook.eval [as call] (eval at create (/cyph/cyph.app/node_modules/tapable/lib/HookCodeFactory.js:19:10), <anonymous>:7:1)
    at Hook.CALL_DELEGATE [as _call] (/cyph/cyph.app/node_modules/tapable/lib/Hook.js:14:14)
    at Compiler.newCompilation (/cyph/cyph.app/node_modules/@angular-devkit/build-angular/node_modules/webpack/lib/Compiler.js:1030:30)
    at /cyph/cyph.app/node_modules/@angular-devkit/build-angular/node_modules/webpack/lib/Compiler.js:1073:29
    at Hook.eval [as callAsync] (eval at create (/cyph/cyph.app/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:15:1)
    at Hook.CALL_ASYNC_DELEGATE [as _callAsync] (/cyph/cyph.app/node_modules/tapable/lib/Hook.js:18:14)
    at Compiler.compile (/cyph/cyph.app/node_modules/@angular-devkit/build-angular/node_modules/webpack/lib/Compiler.js:1068:28)
    at Compiler.runAsChild (/cyph/cyph.app/node_modules/@angular-devkit/build-angular/node_modules/webpack/lib/Compiler.js:520:8)
    at /cyph/cyph.app/node_modules/@ngtools/webpack/src/resource_loader.js:135:27
    at new Promise (<anonymous>)
    at WebpackResourceLoader._compile (/cyph/cyph.app/node_modules/@ngtools/webpack/src/resource_loader.js:134:16)
    at WebpackResourceLoader.get (/cyph/cyph.app/node_modules/@ngtools/webpack/src/resource_loader.js:210:44)
    at Object.resourceHost.readResource (/cyph/cyph.app/node_modules/@ngtools/webpack/src/ivy/host.js:30:35)
    at AdapterResourceLoader.preload (/cyph/cyph.app/node_modules/@angular/compiler-cli/src/ngtsc/resource/src/loader.js:88:39)
(Use `node --trace-warnings ...` to show where the warning was created)
(node:320) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 88)
(node:320) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
⠙ Generating browser application bundles (phase: building)...(node:320) PromiseRejectionHandledWarning: Promise rejection was handled asynchronously (rejection id: 88)
⠴ Generating browser application bundles (phase: building)...WARNING: The same color styles are generated multiple times. Read more about how style duplication can be avoided in a dedicated guide. https://github.com/angular/components/blob/master/guides/duplicate-theming-styles.md
    node_modules/@angular/material/core/theming/_theming.scss 289:7                    private-check-duplicate-theme-styles()
    node_modules/@angular/material/progress-spinner/_progress-spinner-theme.scss 31:3  theme()
    src/css/mixins.scss 167:4                                                          cyph-apply-theme()
    src/css/cyph.base.scss 5:1                                                         @import
    src/css/cyph.app.scss 11:9                                                         root stylesheet

[...]

✔ Browser application bundle generation complete.

Warning: /cyph/cyph.app/src/js/externals/_stream_duplex.ts is part of the TypeScript compilation but it's unused.
Add only entry points to the 'files' or 'include' properties in your tsconfig.

[...]

./node_modules/@angular-devkit/build-angular/src/webpack/es5-polyfills.js - Error: Module build failed (from ./node_modules/@ngtools/webpack/src/ivy/index.js):
TypeError: The 'compilation' argument must be an instance of Compilation
    at getCompilationHooks (/cyph/cyph.app/node_modules/webpack/lib/javascript/JavascriptModulesPlugin.js:125:10)
    at /cyph/cyph.app/node_modules/webpack/lib/javascript/CommonJsChunkFormatPlugin.js:43:19
    at Hook.eval [as call] (eval at create (/cyph/cyph.app/node_modules/tapable/lib/HookCodeFactory.js:19:10), <anonymous>:7:1)
    at Hook.CALL_DELEGATE [as _call] (/cyph/cyph.app/node_modules/tapable/lib/Hook.js:14:14)
    at Compiler.newCompilation (/cyph/cyph.app/node_modules/@angular-devkit/build-angular/node_modules/webpack/lib/Compiler.js:1030:30)
    at /cyph/cyph.app/node_modules/@angular-devkit/build-angular/node_modules/webpack/lib/Compiler.js:1073:29
    at Hook.eval [as callAsync] (eval at create (/cyph/cyph.app/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:15:1)
    at Hook.CALL_ASYNC_DELEGATE [as _callAsync] (/cyph/cyph.app/node_modules/tapable/lib/Hook.js:18:14)
    at Compiler.compile (/cyph/cyph.app/node_modules/@angular-devkit/build-angular/node_modules/webpack/lib/Compiler.js:1068:28)
    at Compiler.runAsChild (/cyph/cyph.app/node_modules/@angular-devkit/build-angular/node_modules/webpack/lib/Compiler.js:520:8)
    at /cyph/cyph.app/node_modules/@ngtools/webpack/src/resource_loader.js:135:27
    at new Promise (<anonymous>)
    at WebpackResourceLoader._compile (/cyph/cyph.app/node_modules/@ngtools/webpack/src/resource_loader.js:134:16)
    at WebpackResourceLoader.get (/cyph/cyph.app/node_modules/@ngtools/webpack/src/resource_loader.js:210:44)
    at Object.resourceHost.readResource (/cyph/cyph.app/node_modules/@ngtools/webpack/src/ivy/host.js:30:35)
    at AdapterResourceLoader.preload (/cyph/cyph.app/node_modules/@angular/compiler-cli/src/ngtsc/resource/src/loader.js:88:39)

./src/js/cyph.app/main.ts - Error: Module build failed (from ./node_modules/@ngtools/webpack/src/ivy/index.js):
TypeError: The 'compilation' argument must be an instance of Compilation
    at getCompilationHooks (/cyph/cyph.app/node_modules/webpack/lib/javascript/JavascriptModulesPlugin.js:125:10)
    at /cyph/cyph.app/node_modules/webpack/lib/javascript/CommonJsChunkFormatPlugin.js:43:19
    at Hook.eval [as call] (eval at create (/cyph/cyph.app/node_modules/tapable/lib/HookCodeFactory.js:19:10), <anonymous>:7:1)
    at Hook.CALL_DELEGATE [as _call] (/cyph/cyph.app/node_modules/tapable/lib/Hook.js:14:14)
    at Compiler.newCompilation (/cyph/cyph.app/node_modules/@angular-devkit/build-angular/node_modules/webpack/lib/Compiler.js:1030:30)
    at /cyph/cyph.app/node_modules/@angular-devkit/build-angular/node_modules/webpack/lib/Compiler.js:1073:29
    at Hook.eval [as callAsync] (eval at create (/cyph/cyph.app/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:15:1)
    at Hook.CALL_ASYNC_DELEGATE [as _callAsync] (/cyph/cyph.app/node_modules/tapable/lib/Hook.js:18:14)
    at Compiler.compile (/cyph/cyph.app/node_modules/@angular-devkit/build-angular/node_modules/webpack/lib/Compiler.js:1068:28)
    at Compiler.runAsChild (/cyph/cyph.app/node_modules/@angular-devkit/build-angular/node_modules/webpack/lib/Compiler.js:520:8)
    at /cyph/cyph.app/node_modules/@ngtools/webpack/src/resource_loader.js:135:27
    at new Promise (<anonymous>)
    at WebpackResourceLoader._compile (/cyph/cyph.app/node_modules/@ngtools/webpack/src/resource_loader.js:134:16)
    at WebpackResourceLoader.get (/cyph/cyph.app/node_modules/@ngtools/webpack/src/resource_loader.js:210:44)
    at Object.resourceHost.readResource (/cyph/cyph.app/node_modules/@ngtools/webpack/src/ivy/host.js:30:35)
    at AdapterResourceLoader.preload (/cyph/cyph.app/node_modules/@angular/compiler-cli/src/ngtsc/resource/src/loader.js:88:39)

./src/js/cyph.app/polyfills.ts - Error: Module build failed (from ./node_modules/@ngtools/webpack/src/ivy/index.js):
TypeError: The 'compilation' argument must be an instance of Compilation
    at getCompilationHooks (/cyph/cyph.app/node_modules/webpack/lib/javascript/JavascriptModulesPlugin.js:125:10)
    at /cyph/cyph.app/node_modules/webpack/lib/javascript/CommonJsChunkFormatPlugin.js:43:19
    at Hook.eval [as call] (eval at create (/cyph/cyph.app/node_modules/tapable/lib/HookCodeFactory.js:19:10), <anonymous>:7:1)
    at Hook.CALL_DELEGATE [as _call] (/cyph/cyph.app/node_modules/tapable/lib/Hook.js:14:14)
    at Compiler.newCompilation (/cyph/cyph.app/node_modules/@angular-devkit/build-angular/node_modules/webpack/lib/Compiler.js:1030:30)
    at /cyph/cyph.app/node_modules/@angular-devkit/build-angular/node_modules/webpack/lib/Compiler.js:1073:29
    at Hook.eval [as callAsync] (eval at create (/cyph/cyph.app/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:15:1)
    at Hook.CALL_ASYNC_DELEGATE [as _callAsync] (/cyph/cyph.app/node_modules/tapable/lib/Hook.js:18:14)
    at Compiler.compile (/cyph/cyph.app/node_modules/@angular-devkit/build-angular/node_modules/webpack/lib/Compiler.js:1068:28)
    at Compiler.runAsChild (/cyph/cyph.app/node_modules/@angular-devkit/build-angular/node_modules/webpack/lib/Compiler.js:520:8)
    at /cyph/cyph.app/node_modules/@ngtools/webpack/src/resource_loader.js:135:27
    at new Promise (<anonymous>)
    at WebpackResourceLoader._compile (/cyph/cyph.app/node_modules/@ngtools/webpack/src/resource_loader.js:134:16)
    at WebpackResourceLoader.get (/cyph/cyph.app/node_modules/@ngtools/webpack/src/resource_loader.js:210:44)
    at Object.resourceHost.readResource (/cyph/cyph.app/node_modules/@ngtools/webpack/src/ivy/host.js:30:35)
    at AdapterResourceLoader.preload (/cyph/cyph.app/node_modules/@angular/compiler-cli/src/ngtsc/resource/src/loader.js:88:39)

Angular 12 with Webpack 4:

⠋ Generating browser application bundles...Warning: Entry point 'devextreme-angular/ui/file-manager' contains deep imports into '/cyph/cyph.app/node_modules/devextreme/ui/file_manager', '/cyph/cyph.app/node_modules/devextreme/bundles/dx.all'. This is probably not a problem, but may cause the compilation of entry points to be out of order.
Warning: Entry point 'angular2-text-mask' contains deep imports into '/cyph/cyph.app/node_modules/text-mask-core/dist/textMaskCore'. This is probably not a problem, but may cause the compilation of entry points to be out of order.
Warning: Entry point 'devextreme-angular/core' contains deep imports into '/cyph/cyph.app/node_modules/devextreme/core/utils/common', '/cyph/cyph.app/node_modules/devextreme/core/dom_adapter', '/cyph/cyph.app/node_modules/devextreme/events', '/cyph/cyph.app/node_modules/devextreme/core/renderer', '/cyph/cyph.app/node_modules/devextreme/core/http_request', '/cyph/cyph.app/node_modules/devextreme/core/utils/ready_callbacks', '/cyph/cyph.app/node_modules/devextreme/events/core/events_engine', '/cyph/cyph.app/node_modules/devextreme/core/utils/ajax', '/cyph/cyph.app/node_modules/devextreme/core/utils/deferred'. This is probably not a problem, but may cause the compilation of entry points to be out of order.
Warning: Entry point 'devextreme-angular/ui/nested' contains deep imports into '/cyph/cyph.app/node_modules/devextreme/bundles/dx.all', '/cyph/cyph.app/node_modules/devextreme/animation/fx', '/cyph/cyph.app/node_modules/devextreme/viz/core/base_widget', '/cyph/cyph.app/node_modules/devextreme/ui/widget/ui.widget', '/cyph/cyph.app/node_modules/devextreme/ui/box', '/cyph/cyph.app/node_modules/devextreme/ui/button', '/cyph/cyph.app/node_modules/devextreme/ui/tab_panel', '/cyph/cyph.app/node_modules/devextreme/ui/form', '/cyph/cyph.app/node_modules/devextreme/data/abstract_store', '/cyph/cyph.app/node_modules/devextreme/ui/pivot_grid/xmla_store', '/cyph/cyph.app/node_modules/devextreme/ui/popup'. This is probably not a problem, but may cause the compilation of entry points to be out of order.
(node:8623) [DEP_WEBPACK_MAIN_TEMPLATE_HASH_FOR_CHUNK] DeprecationWarning: MainTemplate.hooks.hashForChunk is deprecated (use JavascriptModulesPlugin.getCompilationHooks().chunkHash instead)
(Use `node --trace-deprecation ...` to show where the warning was created)
(node:8623) [DEP_WEBPACK_CHUNK_TEMPLATE_HASH_FOR_CHUNK] DeprecationWarning: ChunkTemplate.hooks.hashForChunk is deprecated (use JavascriptModulesPlugin.getCompilationHooks().chunkHash instead)
(node:8623) [DEP_WEBPACK_COMPILATION_OPTIMIZE_CHUNK_ASSETS] DeprecationWarning: optimizeChunkAssets is deprecated (use Compilation.hooks.processAssets instead and use one of Compilation.PROCESS_ASSETS_STAGE_* as stage option)
(node:8623) UnhandledPromiseRejectionWarning: TypeError: webpack_1.node.NodeTargetPlugin is not a constructor
    at WebpackResourceLoader._compile (/cyph/cyph.app/node_modules/@ngtools/webpack/src/resource_loader.js:83:13)
    at WebpackResourceLoader.get (/cyph/cyph.app/node_modules/@ngtools/webpack/src/resource_loader.js:210:44)
    at Object.resourceHost.readResource (/cyph/cyph.app/node_modules/@ngtools/webpack/src/ivy/host.js:30:35)
    at AdapterResourceLoader.preload (/cyph/cyph.app/node_modules/@angular/compiler-cli/src/ngtsc/resource/src/loader.js:88:39)
    at resolveStyleUrl (/cyph/cyph.app/node_modules/@angular/compiler-cli/src/ngtsc/annotations/src/component.js:192:49)
    at /cyph/cyph.app/node_modules/@angular/compiler-cli/src/ngtsc/annotations/src/component.js:233:83
    at Array.map (<anonymous>)
    at ComponentDecoratorHandler.preanalyze (/cyph/cyph.app/node_modules/@angular/compiler-cli/src/ngtsc/annotations/src/component.js:233:50)
    at _loop_1 (/cyph/cyph.app/node_modules/@angular/compiler-cli/src/ngtsc/transform/src/compilation.js:321:53)
    at TraitCompiler.analyzeClass (/cyph/cyph.app/node_modules/@angular/compiler-cli/src/ngtsc/transform/src/compilation.js:343:35)
    at visit (/cyph/cyph.app/node_modules/@angular/compiler-cli/src/ngtsc/transform/src/compilation.js:113:27)
    at visitNodes (/cyph/cyph.app/node_modules/typescript/lib/typescript.js:28217:30)
    at Object.forEachChild (/cyph/cyph.app/node_modules/typescript/lib/typescript.js:28456:24)
    at visit (/cyph/cyph.app/node_modules/@angular/compiler-cli/src/ngtsc/transform/src/compilation.js:115:20)
    at TraitCompiler.analyze (/cyph/cyph.app/node_modules/@angular/compiler-cli/src/ngtsc/transform/src/compilation.js:117:13)
    at TraitCompiler.analyzeAsync (/cyph/cyph.app/node_modules/@angular/compiler-cli/src/ngtsc/transform/src/compilation.js:79:25)
(node:8623) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 88)
(node:8623) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
✔ Browser application bundle generation complete.

Error: webpack_1.util.cleverMerge is not a function

Error: webpack_1.util.cleverMerge is not a function

Error: webpack_1.util.cleverMerge is not a function

Error: webpack_1.util.cleverMerge is not a function

Error: webpack_1.util.cleverMerge is not a function

Your Environment

Angular Version:

Angular CLI: 12.0.0
Node: 14.17.0
Package Manager: npm 7.12.1
OS: linux arm64

Angular:
...

Package                      Version
------------------------------------------------------
@angular-devkit/architect    0.1200.0
@angular-devkit/core         12.0.0
@angular-devkit/schematics   12.0.0
@schematics/angular          12.0.0

Anything else relevant?

[alan-agius4]

@buu700, it's not clear how dependencies are managed in your project. The above errors indicated that you have the wrong version of Webpack installed in your application.

Webpack is a direct dependency of @angular-devkit/build-angular and does not get updated separately.

Can you try deleting the package lock file and the node modules directory and then reinstalling?

If the problem persists please provide the output of npm ls webpack

[cardamon]

FYI, this may be caused by having the mini-css-extract-plugin in your devDependencies. For us, just removing it fixed the error.
(We needed in the past as a workaround for some obscure SCSS error, but it no longer seems to be necessary...)

[mshima]

I can confirm the error:

npm ls webpack output:

├─┬ @angular-builders/custom-webpack@12.0.0-beta.0
│ └─┬ @angular-devkit/build-angular@12.0.0
│   ├─┬ @angular-devkit/build-optimizer@0.1200.0
│   │ └── webpack@5.37.0 deduped
│   ├─┬ @angular-devkit/build-webpack@0.1200.0
│   │ └── webpack@5.37.0 deduped
│   ├─┬ @ngtools/webpack@12.0.0
│   │ └── webpack@5.37.0 deduped
│   ├─┬ babel-loader@8.2.2
│   │ └── webpack@5.37.0 deduped
│   ├─┬ circular-dependency-plugin@5.2.2
│   │ └── webpack@5.37.0 deduped
│   ├─┬ css-loader@5.2.4
│   │ └── webpack@5.37.0 deduped
│   ├─┬ less-loader@8.1.1
│   │ └── webpack@5.37.0 deduped
│   ├─┬ mini-css-extract-plugin@1.5.1
│   │ └── webpack@5.37.0 deduped
│   ├─┬ postcss-loader@5.2.0
│   │ └── webpack@5.37.0 deduped
│   ├─┬ raw-loader@4.0.2
│   │ └── webpack@5.37.0 deduped
│   ├─┬ sass-loader@11.0.1
│   │ └── webpack@5.37.0 deduped
│   ├─┬ source-map-loader@2.0.1
│   │ └── webpack@5.37.0 deduped
│   ├─┬ style-loader@2.0.0
│   │ └── webpack@5.37.0 deduped
│   ├─┬ stylus-loader@5.0.0
│   │ └── webpack@5.37.0 deduped
│   ├─┬ terser-webpack-plugin@4.2.3
│   │ └── webpack@5.37.0 deduped
│   ├─┬ webpack-dev-middleware@4.1.0
│   │ └── webpack@5.37.0 deduped
│   ├─┬ webpack-dev-server@3.11.2
│   │ ├─┬ webpack-dev-middleware@3.7.3
│   │ │ └── webpack@5.37.0 deduped
│   │ └── webpack@5.37.0 deduped
│   ├─┬ webpack-subresource-integrity@1.5.2
│   │ └── webpack@5.37.0 deduped
│   └─┬ webpack@5.36.2
│     └─┬ terser-webpack-plugin@5.1.2
│       └── webpack@5.36.2 deduped
├─┬ browser-sync-webpack-plugin@2.3.0
│ └── webpack@5.37.0 deduped
├─┬ copy-webpack-plugin@8.1.1
│ └── webpack@5.37.0 deduped
├─┬ eslint-webpack-plugin@2.5.4
│ └── webpack@5.37.0 deduped
├─┬ simple-progress-webpack-plugin@2.0.0
│ └── webpack@5.37.0 deduped
└─┬ webpack@5.37.0
  └─┬ terser-webpack-plugin@5.1.2
    └── webpack@5.37.0 deduped

Reverting webpack to 5.36.2 to match @angular-devkit/build-angular fixed version fix the problem.

[buu700]

Thanks @mshima and @alan-agius4, that got me closer. I didn't realize that installing webpack directly in our package.json would cause issues. We use webpack separately from Angular as well, but having just @angular-devkit/build-angular and webpack-cli was enough for what we need.

I'm seeing something else now, but I think it's an unrelated issue, so I'm going to go ahead and create a new ticket. I'll also leave this ticket open in case this issue is still considered a bug in and of itself (or something that needs to be documented, if it isn't already).

FYI, this may be caused by having the mini-css-extract-plugin in your devDependencies. For us, just removing it fixed the error.

Hm, are you sure that's an issue, and if so is it a problem that it's already a dependency of @angular-devkit/build-angular?

[mshima]

Duplicate of #20773

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}