Jest测试Vite构建的React-Typescript项目遇import.meta报错如何不依赖Babel解决？

报错的核心原因是Jest默认运行在CommonJS模块环境下，不存在ESM专属的import.meta全局对象，即使使用SWC或esbuild编译，如果没有对应配置也会保留import.meta语句，运行时就会触发语法错误。以下是三个可直接落地的无Babel解决方案，任选其一即可：

• 方案1：全局注入import.meta对象（配置成本最低）
  直接在你已有的jest/jest.setup.js文件顶部添加如下代码，手动模拟出import.meta对象：

  // 模拟ESM环境的import.meta全局对象
  globalThis.import = globalThis.import || {}
  globalThis.import.meta = {
    env: {
      // 此处填入你项目中所有用到的Vite环境变量
      VITE_APP_API_HOST: 'https://mock.test.com',
      VITE_APP_DEBUG: 'true'
      // 其他自定义环境变量按需补充
    }
  }
  

  配置完成后重启Jest即可生效，无需修改其他配置。

• 方案2：给@swc/jest添加编译适配配置
  修改jest.config.js中的transform配置项，给@swc/jest传入编译参数，让SWC在编译阶段就把import.meta语法替换成兼容CommonJS的代码：

  transform: {
    "^.+\\.(js|jsx|mjs|cjs|ts|tsx)$": [
      "@swc/jest",
      {
        jsc: {
          target: "es2020",
          parser: {
            syntax: "typescript",
            tsx: true
          },
          transform: {
            react: {
              runtime: "automatic"
            }
          }
        }
      }
    ],
    // 其余transform规则保持原有配置不变
  }
  

• 方案3：使用moduleNameMapper映射替换
  如果你不想修改全局变量，也可以通过模块映射直接替换import.meta的引用：

  1. 新建jest/mocks/importMetaMock.js文件，内容如下：

  module.exports = {
    env: {
      VITE_APP_API_HOST: 'https://mock.test.com',
      // 其他你用到的环境变量按需补充
    }
  }
  

  2. 在jest.config.js的moduleNameMapper配置中新增一行：

  moduleNameMapper: {
    // 原有规则保持不变
    '^import\\.meta$': '<rootDir>/jest/mocks/importMetaMock.js'
  }
  

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