执行Jest命令时触发SyntaxError：无法在模块外使用import语句

这个问题核心是Jest默认采用CommonJS模块规范，而你的setupTests.js用了ES模块的import语法，Jest未对该文件做转译导致报错，下面是几种可行的解决办法：

方法1：转译ES模块（推荐） #

通过babel-jest处理JS/JSX文件的ES语法，适配Jest的模块系统：

1. 先安装必要依赖：

   npm install --save-dev babel-jest @babel/core @babel/preset-env @babel/preset-react
   

2. 在项目根目录创建babel.config.js，添加配置：

   module.exports = {
     presets: [
       '@babel/preset-env',
       '@babel/preset-react'
     ]
   };
   

3. 在package.json的Jest配置中指定转译规则：

   "jest": {
     "testEnvironment": "jsdom",
     "setupFilesAfterEnv": ["./setupTests.js"],
     "transform": {
       "^.+\\.(js|jsx)$": "babel-jest"
     }
   }
   

方法2：改用CommonJS语法 #

直接修改setupTests.js的导入方式，适配Jest默认的模块系统：

const Enzyme = require('enzyme');
const Adapter = require('enzyme-adapter-react-17'); // 替换为你实际使用的React版本适配器
Enzyme.configure({ adapter: new Adapter() });

方法3：将项目设为ES模块 #

在package.json顶部添加配置，让Node默认识别ES模块：

{
  "type": "module",
  // 其他项目配置...
  "jest": {
    "testEnvironment": "jsdom",
    "setupFilesAfterEnv": ["./setupTests.js"]
  }
}

注意：这种方式会让整个项目默认使用ES模块，若项目中存在CommonJS的require语法，可能出现兼容问题，需要统一模块规范。

额外检查点 #

• 确认setupFilesAfterEnv的路径正确，保证Jest能找到setupTests.js；
• 检查devDependencies中是否已安装enzyme及对应版本的适配器，版本需与React版本匹配。

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