babel @ 7和jest配置

时间:2018-07-21 12:04:13

标签: babeljs jestjs babel-jest babel-core

也许您可以帮助我? 我尝试将玩笑配置为使用babel @ 7 所以我有:

"jest": "^23.4.1",
"@babel/core": "^7.0.0-beta.54",
"babel-7-jest": "^21.3.3",
"babel-jest": "^20.0.3",

在package.json中有有趣的配置

"jest": {
    "transform": {
      "^.+\\.js$": "babel-7-jest",
    },

得到了

TypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of type string

但是如果我使用

"jest": {
    "transform": {
      "^.+\\.js$": "babel-jest",
    },

我知道了

Requires Babel "^7.0.0-0", but was loaded with "6.26.3". If you are sure you have a compatible version of @babel/core, it is likely that something in your build process is loading the wrong version. Inspect the stack trace of this error to look for the first entry that doesn't mention "@babel/core" or "babel-core" to see what is calling Babel.

babel配置:https://gist.github.com/SilentImp/1506e9c26d16d9839a4469c6f3ae5c4d

也许您有一些想法?

4 个答案:

答案 0 :(得分:17)

我相信我已经找到了一个可行的解决方案(感谢Jest团队提供了破碎的文档并绕过此问题逃避了GitHub问题)。

您需要在devDependencies的{​​{1}}部分中进行以下操作:

package.json

"devDependencies": { "@babel/core": "^7.0.0-beta.54", "@babel/preset-env": "^7.0.0-beta.54", "babel-core": "^7.0.0-bridge.0", "babel-jest": "^23.4.0", "bili": "^3.1.2", "jest": "^23.4.1", "regenerator-runtime": "^0.12.0" } 中的以下内容:

.babelrc

在我的特定项目中,我不需要使用Jest配置,因此我删除了空的{ "presets": [ [ "@babel/preset-env", { "debug": false, "targets": { "browsers": [ "last 3 versions" ] } } ] ] } 文件。

要点:

  • 删除jest.config.js,因为现在official support for it已弃用。
  • 请确保以后只使用babel-7-jest个软件包-我安装的@babel/xyz桥是使用最新Babel 7的“官方”方式。我想这种需求将在某个时候消除。将来一切都迁移到Babel 7。
  • 您现在可以使用包括babel-core在内的ES6 +功能,而不再需要过时的import/export

编辑:

如果您想获得通过/失败测试的更详细的日志,请将其放入您的require()

jest.config.js

答案 1 :(得分:5)

您可以在here上找到有效的示例和教程。

这些都是我所有的Babel软件包:

"@babel/core": "^7.1.2",
"@babel/node": "^7.0.0",
"@babel/preset-env": "^7.1.0",
"@babel/preset-react": "^7.0.0",
"@babel/register": "^7.0.0",
"babel-core": "^7.0.0-bridge.0",
"babel-jest": "^23.6.0",
"babel-loader": "^8.0.4"

我必须像安装mentioned on the Jest website一样安装babel-core@^7.0.0-bridge.0

我的 .babelrc

{
  "presets": [
    "@babel/preset-env",
    "@babel/preset-react"
  ]
}

还有我的npm脚本:jest --config ./test/jest.config.json对于Babel 7升级并没有改变。

答案 2 :(得分:3)

4天前,Facebook为jest添加了babel 7支持,因此不再需要使用babel 7网桥。

有关更多信息: https://github.com/facebook/jest/blob/master/README.md#using-babel

答案 3 :(得分:0)

我在这个问题上苦苦挣扎了几天,直到看到这篇文章之前都没有运气。非常感谢每个人发布他们的作品!

为清楚起见,这是我的配置。这是一个使用Jest的VueJs应用程序。 希望这对某人有帮助:)

我的npm测试脚本

"test:unit": "jest --config ./jest.config.js"

我的通天包

    "@babel/core": "^7.6.2",
    "babel-loader": "^8.0.4",
    "babel-core": "^7.0.0-bridge.0",
    "@babel/preset-env": "^7.6.2",
    "babel-eslint": "^10.0.1",
    "babel-jest": "^23.6.0",
    "@vue/cli-plugin-babel": "^3.11.0",

babel.config.js

module.exports = {
    presets: [
        [
            '@babel/preset-env',
            {
                debug: false,
                targets: {
                    browsers: ['last 3 versions'],
                },
            },
        ],
    ],
};

jest.confg.js

module.exports = {
    verbose: true,
    moduleFileExtensions: ['js', 'json', 'vue'],
    moduleNameMapper: {
        '^@/(.*)$': '<rootDir>/src/$1',
    },
    transform: {
        '^.+\\.vue$': 'vue-jest',
        '.+\\.(css|styl|less|sass|scss|png|jpg|ttf|woff|woff2)$': 'jest-transform-stub',
        '^.+\\.(js|jsx)?$': 'babel-jest',
    },
    transformIgnorePatterns: ['<rootDir>/node_modules/'],
    testMatch: ['**/tests/unit/**/*.spec.(js|jsx|ts|tsx)|**/__tests__/*.(js|jsx|ts|tsx)'],
    collectCoverage: false,
    collectCoverageFrom: ['src/components/*.{js,vue}', '!**/node_modules/**'],
    coverageReporters: ['html', 'text-summary'],
};
相关问题