使用tRPC+TypeScript+Next.js时Jest测试报Unexpected token 'export'错误求助

问题背景 #

基于tRPC、TypeScript和Next.js开发应用，之前测试一直正常，近期未修改测试代码的情况下，Jest突然抛出"Unexpected token 'export'"错误。错误溯源到node_modules/jose/dist/browser/index.js中的ES模块语法未被转译，尝试过修改jest.config.mjs的transformIgnorePatterns和transform规则，但问题未解决。

错误日志核心片段：

SyntaxError: Unexpected token 'export'
    at /home/runner/work/workout-app/workout-app/node_modules/jose/dist/browser/index.js:1
    at Object.<anonymous> (node_modules/@supabase/auth-helpers-shared/src/utils/cookies.ts:3:27)
    at Object.<anonymous> (node_modules/@supabase/auth-helpers-nextjs/src/clientComponentClient.ts:6:8)
    at Object.<anonymous> (src/utils/trpc.ts:21:28)

当前jest.config.mjs配置：

import nextJest from "next/jest.js"

const createJestConfig = nextJest({
  dir: "./",
})

/** @type {import('jest').Config} */
const config = {
  testEnvironment: "jest-environment-jsdom",
}

export default createJestConfig(config)

解决方案 #

问题本质是jose包采用纯ES模块编写，而Jest默认会忽略node_modules目录的转译，导致无法识别export语法。需要精准配置让Jest转译jose及依赖它的Supabase相关包，具体调整如下：

1. 更新jest.config.mjs #

修改配置，添加transformIgnorePatterns指定需要转译的包，同时确保transform规则覆盖对应的文件类型：

import nextJest from "next/jest.js"

const createJestConfig = nextJest({
  dir: "./",
})

/** @type {import('jest').Config} */
const config = {
  testEnvironment: "jest-environment-jsdom",
  // 指定需要转译的node_modules包
  transformIgnorePatterns: [
    "/node_modules/(?!jose|@supabase/auth-helpers-shared|@supabase/auth-helpers-nextjs)",
  ],
  // 确保TS/JS文件都被正确转译
  transform: {
    "^.+\\.(ts|tsx|js|jsx)$": ["babel-jest", { presets: ["next/babel"] }],
  },
}

export default createJestConfig(config)

2. 验证Babel配置（若存在） #

如果项目中有babel.config.js，确保它包含Next.js的预设，保证转译规则一致：

module.exports = {
  presets: ["next/babel"],
}

3. 清理缓存重新测试 #

执行以下命令清理Jest缓存，避免旧配置残留：

npx jest --clearCache

为什么之前的配置无效？ #

• 之前设置transformIgnorePatterns: ["!node_modules/"]会尝试转译所有node_modules包，这不仅效率低，还可能引发其他依赖的转译冲突。
• transform规则中指定的node_modules/variables/.+路径不对，没有覆盖到实际出问题的jose和Supabase相关包。

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