Firebase生成的YAML文件中使用Yarn导致GitHub Action构建失败

一、先抓全TypeScript编译错误细节 #

当前CI日志只输出了tsc版本和命令帮助，说明tsc执行时可能找不到tsconfig.json，或是环境配置有问题。先做两件事：

• 本地执行yarn build，复现错误并查看具体的TS编译问题（比如类型错误、配置缺失）
• 修改GitHub Action的构建命令，强制输出完整日志：

- run: yarn install --frozen-lockfile && yarn run build --verbose

二、修复package.json里的脚本问题 #

你的build:staging脚本还在调用npm run build，但当前已切换到Yarn，这会导致依赖环境不一致，改成Yarn调用：

"build:staging": "env-cmd -f .env.staging yarn build",

同时删掉CRA遗留的test、eject脚本，避免混淆：

"scripts": {
  "start": "vite",
  "build": "tsc && vite build",
  "preview": "vite preview",
  "build:staging": "env-cmd -f .env.staging yarn build",
  "ci": "yarn install --frozen-lockfile",
  "setfbproj": "firebase use --clear --project='myproject'"
}

三、优化GitHub Action的执行流程 #

1. 指定Node.js版本：Vite 5要求Node.js 18及以上，在Action中添加版本配置，同时启用Yarn缓存加速构建：

steps:
  - uses: actions/checkout@v3
  - uses: actions/setup-node@v4
    with:
      node-version: '18'
      cache: 'yarn'
  - run: yarn install --frozen-lockfile
  - run: yarn run build

2. 用--frozen-lockfile强制依赖版本与本地一致，避免CI环境出现意外的依赖更新。

四、检查TS配置与Vite的兼容性 #

确认tsconfig.json适配Vite环境：

• 因为package.json设置了"type": "module"，需确保compilerOptions.module设为ESNext或ES2020
• 核对include和exclude字段，确保所有需要编译的文件都被包含
• 检查vite.config.ts是否正确引入插件：

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
import tsconfigPaths from 'vite-tsconfig-paths'

export default defineConfig({
  plugins: [react(), tsconfigPaths()],
})

五、确认Yarn环境配置有效 #

你的.yarnrc.yml中nodeLinker: node-modules兼容Yarn v1，但要确保仓库里的yarn.lock已经提交到GitHub，否则--frozen-lockfile会执行失败。

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