Webpack 5+使用Firebase Admin时缺失Node核心模块polyfill报错问题

问题根本原因 #

你碰到的报错本质上是两个问题叠加导致的：

1. Webpack 5 之后默认不再内置Node.js核心模块的浏览器polyfill，所有依赖Node核心模块的包在前端打包时都会触发该类报错
2. Firebase Admin SDK 是专门设计用于Node.js服务端环境的工具包，绝对不可以在前端/浏览器环境中引入使用：你打包时引入的serviceAccountKey.json包含Firebase项目的最高管理员权限，一旦泄露到前端会导致你的数据库被恶意篡改、云资源被恶意消耗，直接引发严重的安全事故。

优先推荐解决方案（99%的场景适用） #

放弃在当前代码中使用Firebase Admin SDK，改用官方提供的客户端版Firebase SDK（npm包名为firebase），客户端SDK不需要服务账户密钥，仅用公开的Firebase客户端配置即可初始化，完全适配浏览器环境，不会触发任何Node核心模块polyfill相关报错。

特殊场景解决方案（仅用于Node.js环境打包场景，比如Electron主进程、Next.js服务端代码打包） #

如果你确实是在Node.js运行环境中使用Admin SDK，只是打包工具误将其识别为前端代码需要打包，可以用以下三种方式解决：

方式1：使用插件一次性配置所有polyfill（无需手动添加每个模块）

1. 安装polyfill插件：

npm install node-polyfill-webpack-plugin --save-dev

2. 修改你的webpack配置文件（原生webpack对应webpack.config.js，Next.js对应next.config.js，Vue CLI对应vue.config.js），引入插件即可：

const NodePolyfillPlugin = require('node-polyfill-webpack-plugin');

module.exports = {
  // 保持你原有的其他webpack配置不变
  plugins: [
    new NodePolyfillPlugin()
  ]
}

方式2：将Admin SDK标记为外部依赖不打包

如果是Node.js运行环境，你可以直接让打包工具跳过对firebase-admin的打包，直接调用本地安装的node_modules中的包，从根源上避免polyfill问题：

// webpack配置中添加externals字段
module.exports = {
  // 其他原有配置
  externals: ['firebase-admin']
}

方式3：手动添加单个模块的fallback（不推荐）

如果只缺少少量模块，也可以按报错提示手动在webpack配置的resolve.fallback字段添加对应配置，例如：

module.exports = {
  resolve: {
    fallback: {
      "util": require.resolve("util/"),
      "path": require.resolve("path-browserify"),
      "fs": false // 浏览器环境无法使用fs模块，直接设为false即可
      // 其他报错的模块按提示逐一添加即可
    }
  }
}

内容的提问来源于stack exchange，提问作者Koen de vulder