Angular17 Monorepo：ng build正常但ng serve依赖解析失败

先解决依赖解析错误（无需把依赖移到根目录） #

你遇到的Failed to resolve dependency是pnpm monorepo的hoisting策略导致的——dev server的optimizeDeps没找到这些依赖的正确路径。不用把依赖挪到根目录，改下pnpm的提升规则就行：

• 在monorepo根目录的.npmrc里添加：

  public-hoist-pattern[]=@angular/*
  public-hoist-pattern[]=firebase
  public-hoist-pattern[]=rxfire
  public-hoist-pattern[]=@angular/fire
  

• 执行pnpm install重新安装依赖，再运行ng serve，依赖解析错误应该就会消失。

解决FirebaseApps注入错误 #

如果已经把依赖移到根目录，得确保Angular的DI系统能正确识别Firebase模块：

1. 正确初始化Firebase模块：
   若使用Angular17的standalone模式，在app.config.ts中配置：

   import { provideFirebaseApp, initializeApp } from '@angular/fire/app';
   import { provideAuth, getAuth } from '@angular/fire/auth'; // 按需添加其他Firebase服务模块
   import { environment } from '../environments/environment';
   
   export const appConfig: ApplicationConfig = {
     providers: [
       provideFirebaseApp(() => initializeApp(environment.firebaseConfig)),
       provideAuth(() => getAuth())
     ]
   };
   

   若使用传统NgModule模式，在app.module.ts中配置：

   import { AngularFireModule } from '@angular/fire/compat';
   import { AngularFireAuthModule } from '@angular/fire/compat/auth';
   import { environment } from '../environments/environment';
   
   @NgModule({
     imports: [
       AngularFireModule.initializeApp(environment.firebaseConfig),
       AngularFireAuthModule
     ]
   })
   export class AppModule {}
   

2. 显式声明项目依赖：
   即使根目录有这些依赖，Web应用的package.json里也要直接声明@angular/fire、firebase等，pnpm的严格依赖策略要求项目自身显式声明用到的依赖：

   "dependencies": {
     "@angular/fire": "^7.6.1", // 需选择兼容Angular17的版本
     "firebase": "^10.7.1",
     "rxfire": "^6.0.5"
   }
   

3. 彻底清理缓存重装：

   pnpm store prune
   pnpm install
   ng serve --clear-cache
   

额外检查项 #

• 确认Angular Fire版本与Angular17兼容：Angular Fire 7.6及以上版本支持Angular16+，避免版本不匹配
• 如果monorepo中的库用到了Firebase，库的package.json要把这些依赖设为peerDependencies，不能放在dependencies里，避免重复安装导致DI冲突
• 检查environment.ts里的Firebase配置是否正确，apiKey、projectId等核心字段不能缺失

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