Angular14安装@ng-bootstrap/ng-bootstrap报ERESOLVE依赖错误如何解决

核心报错是版本不匹配导致的peer依赖冲突：

• 你的本地项目Angular版本为14.0.4
• 默认ng add拉取的@ng-bootstrap/ng-bootstrap@12.1.2版本仅支持Angular 13.x，其声明的peer依赖要求@angular/common@^13.0.0，和本地Angular 14版本无法兼容，npm 8.x默认开启的严格依赖解析规则会直接抛出ERESOLVE错误。
• 你之前执行命令时附加的--legacy-peer-deps参数没有被ng add全链路透传给npm安装流程，因此参数未生效。

按顺序执行以下操作即可：

1. 直接指定适配Angular 14的ng-bootstrap大版本执行安装，13.x是官方适配Angular 14的稳定版本：

   ng add @ng-bootstrap/ng-bootstrap@13
   

2. 如果上述命令仍然抛出依赖错误，分开执行安装和配置流程：
   • 第一步：手动通过npm安装对应版本，透传兼容参数跳过严格依赖校验：

     npm install @ng-bootstrap/ng-bootstrap@13 --legacy-peer-deps
     

   • 第二步：跳过安装步骤，仅执行ng add的自动配置流程（自动导入模块、引入bootstrap样式等操作）：

     ng add @ng-bootstrap/ng-bootstrap@13 --skip-confirmation
     

3. 安装完成后做简单校验：
   • 检查angular.json的styles数组中是否已经引入bootstrap.min.css路径
   • 检查根模块app.module.ts中是否已经导入NgbModule
     若以上两项存在缺失，手动补全即可正常使用ng-bootstrap组件。

注意：不要强行用--force参数安装12.x版本适配Angular 14，跨大版本的依赖不兼容会导致运行时出现组件选择器无法识别、依赖注入失败、样式异常等不可预期问题。

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