【发布时间】：2021-08-08 16:06:30
【问题描述】：
我在 Angular 11.2 和 Webpack 4.44 中有一个大型应用程序，我正在尝试分别迁移到版本 12 和 5。
首先，我将我的全局 @angular/cli 升级到 v12，然后运行 ng new test-upgrade 命令来创建一个新应用。
当我在这个新应用程序中运行 ng build 而不更改它的任何内容时。但是当我安装 webpack 5.37.1 并再次运行构建时，我收到了这个错误：
[error] TypeError: 'compilation' 参数必须是 Compilation 的一个实例 在 Function.getCompilationHooks (C:\src\datahub\tdamui-angular\test-upgrade\node_modules\webpack\lib\javascript\JavascriptModulesPlugin.js:113:10) 在 C:\src\datahub\tdamui-angular\test-upgrade\node_modules\terser-webpack-plugin\dist\index.js:566:67 在 _next41（创建时的评估（C:\src\datahub\tdamui-angular\test-upgrade\node_modules\tapable\lib\HookCodeFactory.js:19:10），:77:1） 在 _next19（创建时的评估（C:\src\datahub\tdamui-angular\test-upgrade\node_modules\tapable\lib\HookCodeFactory.js:19:10），:189:1） 在 Hook.eval [as call] (eval at create (C:\src\datahub\tdamui-angular\test-upgrade\node_modules\tapable\lib\HookCodeFactory.js:19:10), :271:1) 在 Hook.CALL_DELEGATE [as _call] (C:\src\datahub\tdamui-angular\test-upgrade\node_modules\tapable\lib\Hook.js:14:14) 在 Compiler.newCompilation (C:\src\datahub\tdamui-angular\test-upgrade\node_modules@angular-devkit\build-angular\node_modules\webpack\lib\Compiler.js:1031:26) 在 C:\src\datahub\tdamui-angular\test-upgrade\node_modules@angular-devkit\build-angular\node_modules\webpack\lib\Compiler.js:1073:29 在 Hook.eval [as callAsync] (创建时的 eval (C:\src\datahub\tdamui-angular\test-upgrade\node_modules\tapable\lib\HookCodeFactory.js:33:10), :22:1) 在 Hook.CALL_ASYNC_DELEGATE [as _callAsync] (C:\src\datahub\tdamui-angular\test-upgrade\node_modules\tapable\lib\Hook.js:18:14)
请记住，这是一个由 cli 生成的新 Angular 项目。我所做的只是安装第 5 版的 webpack。
所以我尝试安装第 4 版的 webpack，但我得到了其他错误。我不会发布这些，因为我需要 webpack v5 才能工作。
一旦我能解决这个问题，我就可以着手修复我的大型应用程序。
有人知道上述错误吗？或者任何人都可以复制，如果他们：
- 安装@angular/cli v12
- 使用 ng new 创建一个新应用
- 运行 ng build（这应该可以）
- 安装 webpack v5
- 运行 ng build（出现上述错误）
- 移除 webpack
- 运行 ng build（会得到一个错误提示 webpack 模块丢失）
在这一点上，我无法让 Angular 12 与 webpack 4 或 5 一起工作，所以它完全坏了，但我知道这不可能。
我在 Windows 10 上，使用节点 14.17。
【问题讨论】：