Angular 17修改文件后二次构建卡顿问题求助

以下是针对你遇到的「首次修改页面重载正常，二次修改卡在Changes detected. Rebuilding...状态」问题的可行解决方案：

• 统一Angular核心依赖版本
  当前package.json中@angular/compiler-cli（17.1.2）与CLI相关依赖（17.1.3）版本不一致，可能引发增量编译缓存异常。将所有Angular相关依赖统一为相同版本：

  "@angular-devkit/build-angular": "17.1.3",
    "@angular/cli": "^17.1.3",
    "@angular/compiler-cli": "^17.1.3",
  

  执行npm install完成依赖更新。

• 禁用构建缓存启动服务
  Angular 17默认启用的增量编译缓存可能导致阻塞，启动时添加参数跳过缓存：

  ng serve --no-build-cache
  

  也可在angular.json的projects.[你的项目名].architect.build.options中永久禁用增量编译：

  "incremental": false
  

• 彻底清理依赖与缓存
  清理旧依赖及构建缓存后重新安装：

  rm -rf node_modules package-lock.json
  npm cache clean --force
  npm install
  

• 调整系统文件监听上限
  macOS或Linux系统中，文件监听数量不足可能导致Angular无法正确检测后续文件变化，临时调整系统参数：

  # macOS
  sudo sysctl -w kern.maxfiles=65536
  sudo sysctl -w kern.maxfilesperproc=65536
  # Linux（Ubuntu/Debian）
  echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf
  sudo sysctl -p
  

• 切换至传统构建器（临时排查）
  若ESBuild构建器存在兼容问题，可临时切换回旧版构建器，修改angular.json中对应项目的build配置：

  "builder": "@angular-devkit/build-angular:browser"
  

  注：此方案会牺牲ESBuild的快速构建性能，仅用于问题排查。

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