问题
Maybe you may help me? I try to configure jest to use babel@7 So I have:
"jest": "^23.4.1",
"@babel/core": "^7.0.0-beta.54",
"babel-7-jest": "^21.3.3",
"babel-jest": "^20.0.3",
And jest config inside package.json
"jest": {
"transform": {
"^.+\\.js$": "babel-7-jest",
},
And got
TypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of type string
But if I use
"jest": {
"transform": {
"^.+\\.js$": "babel-jest",
},
I got
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 config: https://gist.github.com/SilentImp/1506e9c26d16d9839a4469c6f3ae5c4d
Maybe you have some ideas?
回答1:
I believe I have found a working solution (no thanks to the Jest team providing broken documentation and evading GitHub issues around this issue).
You need the following in your devDependencies
section of your 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"
}
The following in your .babelrc
:
{
"presets": [
[
"@babel/preset-env",
{
"debug": false,
"targets": {
"browsers": [
"last 3 versions"
]
}
}
]
]
}
In my particular project I did not need to use the Jest config so I deleted my empty jest.config.js
file.
Key points:
- Remove
babel-7-jest
as this is deprecated as there is now official support for it. - Make sure to only use
@babel/xyz
packages going forward - thebabel-core
bridge one I have installed is the "official" way to use latest Babel 7. I imagine this need will be removed at some point in the future as everything migrates to Babel 7. - You can now use ES6+ features including
import/export
and no longer need the antiquatedrequire()
.
Edit:
If you want to have a more detailed log of passing/failing tests then put this in your jest.config.js
:
module.exports = {
"verbose": true
}
回答2:
You can find a working example and tutorial over here.
These are all my Babel packages:
"@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"
And I had to install babel-core@^7.0.0-bridge.0
like it is mentioned on the Jest website.
My .babelrc:
{
"presets": [
"@babel/preset-env",
"@babel/preset-react"
]
}
And my npm script: jest --config ./test/jest.config.json
It didn't change for the Babel 7 upgrade.
回答3:
4 days ago Facebook added babel 7 support for jest, so no need use the babel 7 bridge anymore.
For more information: https://github.com/facebook/jest/blob/master/README.md#using-babel
回答4:
I have struggled with this issue for a few days with no luck until seeing this post. Thanks so much for everyone posting whats worked from them!
Here is my configuration for clarity. This is a VueJs application using Jest. Hope this helps someone :)
My npm script for tests
"test:unit": "jest --config ./jest.config.js"
My babel packages
"@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'],
};
来源:https://stackoverflow.com/questions/51455882/babel7-and-jest-configuration