Angular 5升级至15后出现Webpack插件初始化前触发Emit错误

1. 检查自定义Webpack配置冲突 #

• 若项目使用@angular-builders/custom-webpack这类自定义Webpack插件，确认插件版本与Angular CLI 15兼容，且配置中没有手动触发Webpack的emit逻辑（比如直接调用compiler.emit()），Angular官方插件会自行处理emit流程。
• 移除Webpack配置中提前触发emit的代码块。

2. 统一依赖版本 #

• 运行npm list @angular/core @angular/cli检查Angular核心依赖版本是否一致，若存在版本差异，执行：

  npm install @angular/core@15.2.10 @angular/cli@15.2.10 --save
  

• 排查第三方依赖（如UI组件库、构建插件）是否支持Angular 15，替换或升级不兼容的依赖包。

3. 清理缓存并重建项目 #

• 执行以下命令清理缓存与重建（Windows环境替换对应命令）：

  npm cache clean --force
  rm -rf node_modules package-lock.json
  npm install
  ng build --delete-output-path
  

  Windows环境替换命令：

  npm cache clean --force
  rd /s /q node_modules
  del package-lock.json
  npm install
  ng build --delete-output-path
  

4. 校验angular.json配置 #

• 确认angular.json中architect.build.builder使用官方Angular构建器：@angular-devkit/build-angular:browser，避免使用旧版自定义builder。
• 移除build.options中可能干扰Webpack插件初始化的自定义配置项，比如手动添加的Webpack插件实例。

5. 移除旧版构建遗留内容 #

• 若项目曾使用ng eject生成过Webpack配置，完全删除相关文件与脚本，Angular 15已不再支持ng eject，需改用官方构建扩展方案。

内容的提问来源于stack exchange，提问作者KKR