首页 文章

在WebStorm for Vue TypeScript中配置jest run配置

提问于
浏览 次
0

我想在WebStorm中执行我的所有测试，但我无法让它工作 . 我使用vue-cli 3.0.0-rc3生成了Babel，TypeScript和Vue的项目 . 我的运行配置如下：

enter image description here

但是我收到以下错误：

● Test suite failed to run

/Users/calberca/Tmp/test-3/src/components/HelloWorld.vue:2
import "core-js/modules/es6.promise";
       ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

SyntaxError: Unexpected string

  1 | import { shallowMount } from "@vue/test-utils";
> 2 | import HelloWorld from "../HelloWorld.vue";
    | ^
  3 | 
  4 | describe("HelloWorld.vue", () => {
  5 |   it("renders props.msg when passed", () => {

  at ScriptTransformer._transformAndBuildScript (node_modules/jest-runtime/build/script_transformer.js:403:17)
  at Object.<anonymous> (src/components/__tests__/HelloWorld.spec.ts:2:1)

当我从控制台运行 yarn test:unit 时，测试通过 . 但是当我运行 jest --config=jest.config.js 时，测试失败了 .

我最初的想法是，它与ts-jest没有用Babel转换代码，并且vue-cli以某种方式切换了一个选项，我想使用相同的命令，但我不知道我应该做什么使它工作 .

注意：我用更大的项目做了这个，并且80％的测试都通过了，但是仍然有一些测试没有通过关于ES6及其他功能的类似错误 .

typescript vue.js webstorm

2 回答

  • 1

    适用于我使用以下配置：

    enter image description here

    我不得不按如下方式更改 jest.config.js 以使其工作：

    module.exports = {
moduleFileExtensions: [
    'ts',
    'tsx',
    'js',
    'jsx',
    'json',
    'vue'
],
transform: {
    '^.+\\.vue$': 'vue-jest',
    '^.+\\.tsx?$': 'ts-jest'
},
moduleNameMapper: {
    '^@/(.*)$': '<rootDir>/src/$1'
},
testMatch: ['<rootDir>/(tests/unit/**/*.spec.(ts|tsx|js)|**/__tests__/*.(ts|tsx|js))'],
snapshotSerializers: [
    'jest-serializer-vue'
]

    }

    回复于
  • 0

    将此添加到 jest.config.js 对我有用

    globals: {
        'ts-jest': {
            skipBabel: true
        }
    }
    回复于

相关问题