Ionic+Angular项目Firebase模拟器组合启动失败及Builder报错问题

一、同时启动Functions和Storage模拟器报错问题 #

可能原因与修复步骤 #

1. 命令格式错误
   同时启动多个模拟器时，必须用无空格的逗号分隔模拟器名称，正确命令为：

   firebase --debug emulators:start --only functions,storage
   

   若写成--only functions storage（空格分隔），Firebase会将storage识别为独立参数，无法匹配到要启动的模拟器集合，从而触发No emulators to start错误。

2. firebase.json配置校验
   检查firebase.json中emulators节点是否同时包含functions和storage的正确配置，示例如下：

   {
     "emulators": {
       "functions": {
         "port": 5001
       },
       "storage": {
         "port": 9199
       },
       "ui": {
         "enabled": true
       }
     }
   }
   

   确认无拼写错误（如function少写s、storage拼写错误），且端口配置无冲突。

二、启动所有模拟器时的Builder错误问题 #

可能原因与修复步骤 #

1. 检查firebase.json的预启动脚本
   若firebase.json的emulators节点配置了prestart脚本（如自动触发Angular构建），示例：

   {
     "emulators": {
       "prestart": "ng build --configuration development"
     }
   }
   

   需确保Angular构建命令可正常执行，单独运行ng build --configuration development，若该命令报错，优先解决Angular构建问题。

2. 校验angular.json的Builder配置
   打开angular.json，找到projects -> [你的项目名称] -> architect -> build节点：

   • 若使用Angular 15及以下版本，确保builder值为@angular-devkit/build-angular:browser，且configurations中包含development配置，示例：

     "build": {
       "builder": "@angular-devkit/build-angular:browser",
       "options": {
         "outputPath": "www",
         "index": "src/index.html",
         "main": "src/main.ts"
       },
       "configurations": {
         "development": {
           "buildOptimizer": false,
           "sourceMap": true
         }
       }
     }
     

   • 若使用Angular 16+版本，默认Builder已改为@angular-devkit/build-angular:application，需修改prestart命令为：

     ng build --configuration development --browser-target [项目名]:build:development
     

     或在angular.json中新增一个基于browser Builder的构建配置。

3. 依赖版本兼容性检查
   执行以下命令查看@angular-devkit/build-angular版本：

   npm ls @angular-devkit/build-angular
   

   确保该版本与Angular核心版本完全匹配（如Angular 15对应15.x版本，Angular 16对应16.x版本），若版本不兼容，运行：

   npm install @angular-devkit/build-angular@[匹配版本号]
   

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