使用ng new创建Angular项目后执行ng serve启动失败如何解决

错误原因 #

本次报错均由依赖兼容性问题、依赖安装不完整导致：

1. 缺失@angular-devkit构建相关依赖文件
2. postcss-loader等webpack加载器无法正常加载
3. 开发服务ws模块依赖缺失

解决步骤 #

• 校验Node.js版本兼容性
  Angular 13仅支持 12.20.x、14.15.x、16.10.x 三个版本区间的Node.js，执行node -v查看当前版本，版本不匹配请先切换到兼容版本。
• 清理旧依赖缓存
  依次执行以下命令清理无效文件：

# 删除本地依赖文件夹
rm -rf node_modules
# 删除依赖锁定文件（Windows系统执行 del package-lock.json）
rm -f package-lock.json
# 清理npm全局缓存
npm cache clean --force

• 全量重新安装依赖
  执行以下命令切换到npm官方源后重新安装依赖，不要使用cnpm等裁剪过依赖的第三方源，避免文件缺失：

npm config set registry https://registry.npmjs.org/
npm install

如果仍提示@angular-devkit相关缺失，可手动重装对应版本的构建依赖：

npm i @angular-devkit/build-angular@13.0.1 --save-dev

• 重启开发服务
  执行ng serve重新启动项目，即可正常编译运行。

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