React+Vite项目中google-auth-library的JWT构造函数报错求助

问题重现 #

在React+Vite的TSX文件中使用google-auth-library的JWT类实现谷歌认证，代码如下：

import { JWT } from 'google-auth-library'

const jwt = new JWT({
  email: creds.client_email,
  key: creds.private_key,
  scopes: [
    'https://www.googleapis.com/auth/spreadsheets',
    'https://www.googleapis.com/auth/drive.file',
  ],
})

出现错误：JWT Class extends value undefined is not a constructor or null，且已确认类型和构造函数存在。

核心原因 #

google-auth-library的JWT模块是为Node.js服务端环境设计的，依赖Node.js内置的crypto、fs等模块，而浏览器环境下缺少这些模块，导致类初始化失败。另外，将私钥（private_key）暴露在前端代码中存在严重安全风险，会导致服务账号泄露。

解决方案 #

方案一：改用后端代理（推荐） #

将JWT认证逻辑移至后端服务，前端通过API调用后端接口完成谷歌服务操作：

1. 后端使用google-auth-library的JWT完成认证，调用谷歌API；
2. 前端发送请求到后端接口，获取处理结果。
   这种方式既规避了浏览器环境的兼容问题，也保证了私钥的安全性。

方案二：为Vite添加Node.js模块Polyfill（仅临时调试用，不推荐生产环境） #

如果仅需临时调试，可通过Vite插件为浏览器环境补充缺失的Node.js模块：

1. 安装依赖：

npm install --save-dev vite-plugin-node-polyfills

2. 修改vite.config.ts配置：

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
import { nodePolyfills } from 'vite-plugin-node-polyfills'

export default defineConfig({
  plugins: [
    react(),
    nodePolyfills({
      include: ['crypto', 'stream'],
      globals: {
        Buffer: true,
      },
    }),
  ],
})

方案三：调整导入路径（版本依赖高，不推荐） #

尝试直接导入JWT的具体实现文件：

import { JWT } from 'google-auth-library/build/src/auth/jwt'

注意：该方式依赖包的内部目录结构，版本更新后可能失效。

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