Angular旧项目本地部署报错：Cannot find module 'cssnano'的原因及解决方法

真实原因 #

这个问题的核心是全局Angular CLI版本和项目依赖的Angular版本严重不匹配，再加上npm 7的严格peer依赖校验逻辑，最终触发了cssnano模块找不到的异常：

1. 你本地全局安装的Angular CLI是12.1.1，但项目依赖的是Angular 9.1.1——跨了3个大版本的CLI和项目，它们的核心构建工具@angular-devkit/build-angular差异极大。高版本的构建工具对cssnano的依赖方式、版本要求，和你项目里指定的cssnano@^4.1.10完全不兼容。
2. npm 7默认会严格检查peer依赖，安装过程中大概率已经出现了你没注意到的peer依赖警告/错误，导致cssnano没有被正确安装到项目的node_modules里，就算安装成功也没法被高版本的构建工具识别。

解决方案（按推荐程度排序） #

方案1：使用项目本地的Angular CLI（最稳妥）

每个Angular项目都应该用和自身版本匹配的CLI，避免全局版本干扰：

• 先清理现有依赖文件，避免残留问题：

  rm -rf node_modules
  # Windows系统用这条删除lock文件
  del package-lock.json
  # Linux/macOS用这条
  # rm package-lock.json
  

• 重新安装项目依赖，确保所有包都是项目指定的版本：

  npm install
  

• 启动项目时，用npx调用项目本地的CLI，而不是全局的：

  npx ng serve
  

  npx会自动查找项目node_modules里的ng命令，保证用的是和Angular 9匹配的CLI版本。

方案2：降级全局Angular CLI到项目匹配版本

如果你习惯用全局CLI命令，可以把全局CLI降到和项目Angular 9对应的版本（Angular 9.1.1对应的CLI稳定版本是9.1.12）：

• 先卸载全局的Angular CLI：

  npm uninstall -g @angular/cli
  

• 安装指定版本的全局CLI：

  npm install -g @angular/cli@9.1.12
  

• 再重新清理依赖并安装启动：

  rm -rf node_modules package-lock.json
  npm install
  ng serve
  

额外排查：确保cssnano正确安装

如果上面的步骤还没解决问题，可以手动把cssnano装到开发依赖里（构建工具依赖应该放在devDependencies而不是dependencies，这可能也是之前找不到的原因之一）：

npm install cssnano@^4.1.10 --save-dev

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