使用 Jest 测试 Vue 失败，Jest 遇到意外令牌，SyntaxError: Unexpected token import [英] Test Vue with Jest fail, Jest encountered an unexpected token, SyntaxError: Unexpected token import

问题描述

我用玩笑测试 Vue 项目，出现错误的错误说:

I test Vue project with jest, bug I got errors says:

Jest 遇到意外令牌和 SyntaxError: Unexpected token import

Jest encountered an unexpected token and SyntaxError: Unexpected token import

这是我的 jest.conf.js，我使用 babel-jest 和 vue jest 设置了transorm"选项，但我仍然收到错误消息，提示无法转换 es6 语法

here is my jest.conf.js, I set the "transorm" option with babel-jest and vue jest, but I still got the error says can't transorm the es6 syntax

const path = require('path')

module.exports = {
  rootDir: path.resolve(__dirname, '../../'),
  moduleFileExtensions: [
    'js',
    'json',
    'vue'
  ],
  moduleNameMapper: {
    '^@/(.*)$': '<rootDir>/src/$1'
  },
  transform: {
    '^.+\.js$': '<rootDir>/node_modules/babel-jest',
    '.*\.(vue)$': '<rootDir>/node_modules/vue-jest'
  },
  testPathIgnorePatterns: [
    '<rootDir>/test/e2e'
  ],
  snapshotSerializers: ['<rootDir>/node_modules/jest-serializer-vue'],
  setupFiles: ['<rootDir>/test/unit/setup'],
  coverageDirectory: '<rootDir>/test/unit/coverage',
  collectCoverageFrom: [
    'src/**/*.{js,vue}',
    '!src/main.js',
    '!src/router/index.js',
    '!**/node_modules/**'
  ]
}

这里是 .babelrc 配置:

and here is the .babelrc config:

{
  "presets": [
    [
      "env",
      {
        "modules": false,
        "targets": {
          "browsers": [
            "> 1%",
            "last 2 versions",
            "not ie <= 8"
          ]
        }
      }
    ],
    "stage-2"
  ],
  "plugins": [
    "transform-vue-jsx",
    "transform-runtime",
    [
      "component",
      {
        "libraryName": "element-ui",
        "styleLibraryName": "~node_modules/modeling-theme-element/lib"
      }
    ]
  ],
  "env": {
    "test": {
      "presets": [
        "env",
        "jest",
        "stage-2"
      ],
      "plugins": [
        [
          "dynamic-import-node",
          {
            "root": [
              "./src"
            ],
            "alias": {
              "@": "./src"
            }
          }
        ]
      ]
    }
  }
}

推荐答案

我遇到了类似的问题，babel-plugin-transform-es2015-modules-commonjs"正在为我工​​作

I had a similar problem and "babel-plugin-transform-es2015-modules-commonjs" is working for me

<代码>npm i -D babel-plugin-transform-es2015-modules-commonjs

.babelrc 配置<代码>插件":[transform-es2015-modules-commonjs"]

.babelrc config "plugins":["transform-es2015-modules-commonjs"]

这篇关于使用 Jest 测试 Vue 失败，Jest 遇到意外令牌，SyntaxError: Unexpected token import的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！