升级到 Webpack 5.79.0 后 NX Angular 项目构建失败

Question

我的 nx monorepo Angular 项目使用版本 5.78.0 正确构建，但升级到 5.79.0 后出现以下错误

NX：15.9.2 角度：15.2.6

 Error: Module parse failed: parser.destructuringAssignmentPropertiesFor is not a function
File was processed with these loaders:
 * ./node_modules/@angular-devkit/build-angular/src/babel/webpack-loader.js
You may need an additional loader to handle the result of these loaders.
TypeError: parser.destructuringAssignmentPropertiesFor is not a function

期望项目能够正确构建

Answer 1

如果您将自定义 webpack 配置与DefinePlugin.

我认为发生这种情况是因为节点模块中安装了多个相互冲突的 webpack 版本；是DefinePlugin从 Node 模块中较新版本的 webpack 加载的，但它本身是从较旧的webpackAngular 构建工具版本的 wepback 加载的。

npm ls webpack如果您在项目文件夹中运行，您可以看到这一点：

> npm ls webpack

+-- @angular-devkit/build-angular@15.2.5
| +-- @angular-devkit/build-webpack@0.1502.5
| | `-- webpack@5.79.0 deduped
...
| `-- webpack@5.76.1

您可以降级到较早版本的 webpack 作为解决方法：

npm i -D webpack@~5.78.0

或者，您可以运行npm dedupe，这将导致仅安装 webpack v5.76.1，但这也会删除其他节点模块的重复数据，这可能是不需要的。