Vue2配置Jest测试报Plugin/Preset导出对象错误如何解决

架构老林

2026-10-4

问题原因

你项目日常构建使用的是 Babel 6 全家桶，但你安装的jest@27、babel-jest@27仅支持 Babel 7，二者版本不匹配导致报错：Babel 7 要求预设/插件必须导出函数，而 Babel 6 的babel-preset-stage-2导出的是对象，不符合要求。

解决方案

你可以选择两种方案解决，按需选择即可：

方案一：降级Jest到兼容Babel 6的版本（改动最小，无需调整现有构建逻辑）

先卸载现有高版本不兼容依赖

npm uninstall jest babel-jest

安装兼容 Babel 6 的Jest版本

npm install jest@23 babel-jest@23 --save-dev

修改.babelrc配置，新增test环境的模块转换规则（Jest运行在Node环境，需要CommonJS模块格式）

{
  "presets": [
    ["env", {
      "modules": false,
      "targets": {
        "browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
      }
    }],
    "stage-2"
  ],
  "plugins": [
    "transform-vue-jsx", 
    "transform-runtime"
  ],
  "comments": false,
  "env": {
    "test": {
      "presets": [
        ["env", { "targets": { "node": "current" } }]
      ]
    }
  }
}

执行测试命令即可正常运行

npm run test:unit

方案二：升级项目Babel到7版本（适合长期维护，统一版本避免后续兼容问题）

卸载所有Babel 6相关依赖

npm uninstall babel-core babel-preset-env babel-preset-stage-2 babel-plugin-transform-runtime babel-plugin-transform-vue-jsx babel-runtime

安装Babel 7对应依赖

# 生产依赖
npm install @babel/runtime @vue/babel-preset-jsx --save
# 开发依赖
npm install @babel/core @babel/preset-env @babel/plugin-transform-runtime babel-jest --save-dev

修改.babelrc为Babel 7格式配置

{
  "presets": [
    ["@babel/preset-env", {
      "modules": false,
      "targets": {
        "browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
      }
    }],
    "@vue/babel-preset-jsx"
  ],
  "plugins": [
    "@babel/plugin-transform-runtime"
  ],
  "comments": false,
  "env": {
    "test": {
      "presets": [
        ["@babel/preset-env", { "targets": { "node": "current" } }]
      ]
    }
  }
}