Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Requires Babel "^7.0.0-0", but was loaded with "6.26.3". #6913

Closed
dmurphy5 opened this issue Aug 29, 2018 · 37 comments · Fixed by #6983
Closed

Requires Babel "^7.0.0-0", but was loaded with "6.26.3". #6913

dmurphy5 opened this issue Aug 29, 2018 · 37 comments · Fixed by #6983

Comments

@dmurphy5
Copy link

🐛 Bug Report

I get the following message when trying to run tests. None of the solutions in the documentation or other issues work.

    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.

      at throwVersionError (node_modules/@babel/plugin-proposal-class-properties/node_modules/@babel/helper-plugin-utils/lib/index.js:65:11)
      at Object.assertVersion (node_modules/@babel/plugin-proposal-class-properties/node_modules/@babel/helper-plugin-utils/lib/index.js:13:11)
      at _default (node_modules/@babel/plugin-proposal-class-properties/lib/index.js:81:7)
      at node_modules/@babel/plugin-proposal-class-properties/node_modules/@babel/helper-plugin-utils/lib/index.js:19:12
          at Array.map (<anonymous>)

To Reproduce

Relevant package.json dependencies/config

{
   "devDependencies": {
        "@babel/core": "^7.0.0",
        "@babel/plugin-proposal-class-properties": "^7.0.0",
        "@babel/plugin-proposal-decorators": "^7.0.0",
        "@babel/plugin-proposal-object-rest-spread": "^7.0.0",
        "@babel/plugin-syntax-dynamic-import": "^7.0.0",
        "@babel/preset-env": "^7.0.0",
        "@babel/preset-react": "^7.0.0",
        "@babel/register": "^7.0.0",
        "babel-core": "^7.0.0-bridge.0",
        "babel-jest": "^23.4.2",
        "babel-loader": "^8.0.0",
        "jest": "^23.5.0",
        "jest-environment-jsdom": "^23.4.0",
        "jest-junit": "^3.6.0",
        "jest-transform-graphql": "^2.1.0",
        "regenerator-runtime": "^0.12.1"
    },
   "jest": {
        "coveragePathIgnorePatterns": [
            "node_modules",
            "/*.graphql"
        ],
        "transform": {
            "\\.(gql|graphql)$": "jest-transform-graphql",
            "^.+\\.js$": "babel-jest"
        },
        "setupFiles": [
            "<rootDir>/src/jestSetup.js"
        ],
        "snapshotSerializers": [
            "enzyme-to-json/serializer"
        ],
        "testResultsProcessor": "jest-junit"
    }
}

.babelrc

{
    "presets": ["@babel/preset-react"],
    "plugins": [
        "@babel/plugin-proposal-class-properties",
        "@babel/plugin-proposal-object-rest-spread",
        "@babel/plugin-syntax-dynamic-import",
        ["@babel/plugin-proposal-decorators", { "legacy": true }]
    ],
    "env": {
        "test": {
            "presets": ["@babel/preset-env", "@babel/preset-react"]
        }
    }
}

jestSetup.js

import 'regenerator-runtime';
import Enzyme from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';

Enzyme.configure({ adapter: new Adapter() });

Expected behavior

Jest runs correctly

Link to repl or repo (highly encouraged)

Please provide either a repl.it demo or a minimal repository on GitHub.

Issues without a reproduction link are likely to stall.

Run npx envinfo --preset jest

Throws the follwing error

(node:792) UnhandledPromiseRejectionWarning: TypeError: Cannot read property '1' of null

@davidcalhoun
Copy link

davidcalhoun commented Aug 29, 2018

Strange. I got the exact same error due to me removing babel-core when I updated to Babel 7. I re-added it alongside @babel/core and that fixed it, although I see you're already doing that above:

  "devDependencies": {
    "@babel/core": "^7.0.0",
    "babel-core": "7.0.0-bridge.0"
  }

Are you using package-lock.json? Maybe try deleting it and also remove node_modules, then reinstall? I wonder if there's something lingering from before you upgraded to Babel 7?

@jorgegonzalez
Copy link

Running yarn why babel-core points to jest-runtime as the culprit:

screen shot 2018-08-30 at 3 22 28 am

@SimenB
Copy link
Member

SimenB commented Aug 30, 2018

I think this should work, your config looks correct...

Mind setting up a repo showing the error?

@herodrigues
Copy link

herodrigues commented Aug 30, 2018

@jorgegonzalez same here in the project I'm working on

Since I've updated to babel 8 (@babel/core), all tests are breaking.

 FAIL  test/spec/utils.test.js
  ● Test suite failed to run

    Jest encountered an unexpected token

    This usually means that you are trying to import a file which Jest cannot parse, e.g. it's not plain JavaScript.

    By default, if Jest sees a Babel config, it will use that to transform your files, ignoring "node_modules".

    Here's what you can do:
     • To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config.
     • If you need a custom transformation specify a "transform" option in your config.
     • If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option.

    You'll find more details and examples of these config options in the docs:
    https://jestjs.io/docs/en/configuration.html

    Details:

    /home/herinson/.../test/jest.setup.js:1
    ({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){import { configure } from 'enzyme';
                                                                                                    ^

    SyntaxError: Unexpected token {

      at ScriptTransformer._transformAndBuildScript (node_modules/jest-runtime/build/script_transformer.js:403:17)

And if I run npm ls babel-core, it shows that jest-runtime depends on [email protected]

└─┬ [email protected]
  └─┬ [email protected]
    ├─┬ [email protected]
    │ └─┬ [email protected] 
    │   └─┬ [email protected]
    │     └── [email protected]  deduped
    └─┬ [email protected]
      └── [email protected]  deduped

@matthamil
Copy link

matthamil commented Aug 30, 2018

I was able to get rid of this error by copying node_modules/babel-core into node_modules/jest-config/node_modules overriding the installed babel-core that jest-config installs as its dependency. If you are hitting this error, can you check node_modules/jest-config/node_modules/babel-core and see what version it installed? Compare this with your node_modules/babel-core directory. If your project's babel-core is at 7.0.0-bridge.0, it should look much different from the one in the node_modules/jest-config/node_modules directory.

I did a simple test a minute ago to see if updating jest-config's dep version fixes the issue, and it looks like it does:

cp -r node_modules/babel-core node_modules/jest-config/node_modules

This will copy your 7.0.0 version into the jest-config's dependencies. Run your tests again. This worked for me locally, but I am curious if this works for anyone else. If it does, then my PR #6926 may be a proper resolution for this?

⚠️ NOTE: Copying your node_modules/babel-core directory into node_modules/jest-config/node_modules is not a permanent solution. As soon as you need to reinstall dependencies from scratch again (e.g. for CI), this won't work.

@dmurphy5
Copy link
Author

dmurphy5 commented Aug 30, 2018

@matthamil That did it. Thanks!

@herodrigues
Copy link

@matteofigus that won't work for babel 8 as all babel modules for this version are installed at node_modules/@babel

@g-plane
Copy link

g-plane commented Aug 31, 2018

My personal temporary solution is adding a postinstall npm script: rimraf node_modules/jest-runtime/node_modules/babel-core node_modules/jest-config/node_modules/babel-core

Note: I am using Yarn.

@baldurh
Copy link

baldurh commented Aug 31, 2018

A solution for Yarn is to add a resolutions field to package.json like so:

"resolutions": {
  "babel-core": "7.0.0-bridge.0"
}

And then run yarn to update the dependency resolutions

@matthamil
Copy link

@herodrigues good point, I updated the PR to reflect the namespaced @babel/core: https://github.com/facebook/jest/pull/6926/files#diff-42f440414578ffb55a0c454ba79a0d5b

@jaywcjlove
Copy link

This will be a good solution

sudo npm install [email protected] --save-dev

Run your tests again. This worked for me locally

@DBosley
Copy link

DBosley commented Sep 6, 2018

What's the status on this issue? This is preventing me from updating my project to babel 7. A solution that only works for yarn users isn't a solution.

@phil-lgr
Copy link

phil-lgr commented Sep 8, 2018

@g-plane's solution worked for me..

npm install [email protected] --save-dev

and add a postinstall npm script with rimraf node_modules/jest-runtime/node_modules/babel-core node_modules/jest-config/node_modules/babel-core

@tdd
Copy link
Contributor

tdd commented Sep 10, 2018

The rimraf hack is fugly. I'm teaching a React / Redux / Jest class next week and having this postinstall script in my demo app's package.json makes me want to take a shower.

Please, please Jest team, fix this ASAP!

@herodrigues
Copy link

herodrigues commented Sep 10, 2018

A new minor version (23.6.0) was just released, but jest still depends on [email protected]

$ npm ls babel-core
└─┬ [email protected]
  └─┬ [email protected]
    └─┬ [email protected]
      └── [email protected]
npm WARN [email protected] requires a peer of babel-core@^6.0.0 || ^7.0.0-0 but 
none is installed. You must install peer dependencies yourself.

@tdd
Copy link
Contributor

tdd commented Sep 10, 2018 via email

@DBosley
Copy link

DBosley commented Sep 10, 2018

It looks like this is the PR they're working on to implement this:
#6949
Hopefully they can get it done quickly.

@SimenB
Copy link
Member

SimenB commented Sep 15, 2018

Again, Jest works perfectly fine with Babel 7. It things are loaded incorrectly it's an issue with configuration.

I've opened up a PR adding an example to Jest's code base using babel 7: #6983

@kettanaito
Copy link
Contributor

kettanaito commented Sep 15, 2018

Thank you, @SimenB. Your example helped me to get Jest up and running.

For others wondering, I needed to explicitly add @babel/plugin-transform-modules-commonjs plugin to my babel.config.js. After that an error on unexpected import vanished.

My babel.config.js:

'use strict'

module.exports = {
  presets: ['@babel/preset-env', '@babel/preset-react', '@babel/preset-flow'],
  plugins: [
    // adding this one solved the issue
    '@babel/plugin-transform-modules-commonjs',
    '@babel/plugin-proposal-export-default-from',
    '@babel/plugin-proposal-export-namespace-from',
    '@babel/plugin-proposal-class-properties',
    '@babel/plugin-proposal-object-rest-spread',
  ],
}

@SimenB
Copy link
Member

SimenB commented Sep 15, 2018

That seems odd, that plugin should be part of the env preset already... Anyways, this issue is about the Requires Babel "^7.0.0-0", but was loaded with "6.26.3" error, not syntax error.

Awesome you got it to work, though!

@DBosley
Copy link

DBosley commented Sep 17, 2018

@SimenB I have already installed the bridge package for Babel 7, that does not fix the error unless I use yarn and I set up a resolves section in my package.json. Running npm ls babel-core outputs exactly what @herodrigues listed above.

@herodrigues
Copy link

herodrigues commented Sep 17, 2018

@DBosley yeah, it still depends on [email protected] but that's not the problem.

I didn't have [email protected] installed. After installing it, it should work as expected.
Also, you should have a babel.config.js file with your plugins and presets.

@SimenB
Copy link
Member

SimenB commented Sep 17, 2018

It doesn't matter that babel-core comes from jest-runtime, it will still work, and load the correct version.

Make sure to use babel.config.js if you're still having issues

@gpbl
Copy link

gpbl commented Sep 17, 2018

(I should say it's hard to deal with this issue, I had the joy to fix it three times and still I'm not sure what I've done to make the error to go away 😄)

@tyler-johnson
Copy link

I will also add that this has been a little more difficult than "just install babel-core@bridge". In my case, I had to delete node_modules and package-lock.json and do a full rebuild to get the dependency tree correct.

@SimenB
Copy link
Member

SimenB commented Sep 18, 2018

Small improvements like the above in the form of e.g. "You may have to delete your lockfile to get the correct dependency tree" is welcome as pull requests!

I would think that a npm dedupe would have fixed it as well, FWIW

@tdd
Copy link
Contributor

tdd commented Sep 18, 2018

Are you telling me that on a fresh project, if we install Babel 7 and babel-core@7-bridge, then install Jest, we don't get Babel version conflicts? How is that even possible considering that, for instance, jest-runtime currently has a clear dependency on babel-core@6, and therefore will have it installed locally and prioritized over the higher-up @7-bridge?

So far the only workaround I've seen that works is to manually strip the locally-installed babel-cores@6 in jest-config and jest-runtime, so they pick up the project-level v7…

@tdd
Copy link
Contributor

tdd commented Sep 18, 2018

(At any rate, on any existing project, deleting package-lock may not be an option, and we do get the versioning conflict, so… seems to me fixing jest-runtime and jest-config's dependencies (to something like ">= 6" would be the better way)

@SimenB
Copy link
Member

SimenB commented Sep 18, 2018

Are you telling me that on a fresh project, if we install Babel 7 and babel-core@7-bridge, then install Jest, we don't get Babel version conflicts?

Almost, you also need to install babel-jest. Then yes, you will not get conflicts

At any rate, on any existing project, deleting package-lock may not be an option

Yarn dedupes by default, but you could try to run npm dedupe to avoid blowing away the lockfile completely if you're having issues. But make sure to install babel-jest as well

@tdd
Copy link
Contributor

tdd commented Sep 18, 2018 via email

@panjiesw
Copy link

Starting on a fresh project using @babel/*@^7.0.0 [email protected] [email protected] [email protected], can confirm that it works as expected. No runtime version conflict whatsoever.

Experience on upgrading existing project though, involves fighting with remove-readd dependencies and lockfiles.

@SimenB
Copy link
Member

SimenB commented Sep 21, 2018

It doesn't matter that jest internally requires its own version, we require the version you define when transpiling your code (just make sure to have the bridge package at the top level)

@herodrigues
Copy link

@SimenB better lock this issue. People will keep coming here to complain about it even though they don't check their project configuration.

@DBosley
Copy link

DBosley commented Sep 21, 2018

I was able to get my project working by running npm remove jest babel-jest then reinstalling them with [email protected] already installed. The errors about babel 6.26.3 went away after doing this

@SimenB
Copy link
Member

SimenB commented Sep 21, 2018

@herodrigues good call!

If people have (babel) issues with Babel 7 whilst:

  • not using create-react-app
  • using jest@23 or older
  • uses babel-core@bridge and @babel/core@7
  • have both jest and babel-jest in package.json

feel free to open a new issue. If you fit any of the requirements above, without fulfilling all of them, also feel free to open up a new issue!

@jestjs jestjs locked as resolved and limited conversation to collaborators Sep 21, 2018
@gaearon
Copy link
Contributor

gaearon commented Jan 17, 2019

@SimenB FYI, I've seen non-native speakers misunderstand your comment as a call to "do not use create-react-app" :-) To future readers — if you read it that way, please start again and re-read the whole comment.

@SimenB
Copy link
Member

SimenB commented Jan 17, 2019

Sorry! Changed it to "not using create-react-app". Feel free to edit my comment yourself if you think it can be further clarified. Did not mean to imply you shouldn't use CRA 🙂

EDIT: Also moved it to the top so it reads more naturally

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.