Node build failed with babel throws an Error: Requires Babel "^7.0.0-0", but was loaded with "6.26.0"

Question

I'm trying to build node app with babel but it throws an error.

Error: Requires Babel "^7.0.0-0", but was loaded with "6.26.0". 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 (E:\mern-master\node_modules\@babel\helper-plugin-utils\lib\index.js:65:11)
at Object.assertVersion (E:\mern-master\node_modules\@babel\helper-plugin-utils\lib\index.js:13:11)
at _default (E:\mern-master\node_modules\@babel\plugin-proposal-object-rest-spread\lib\index.js:41:7)
at E:\mern-master\node_modules\@babel\helper-plugin-utils\lib\index.js:19:12
at Function.memoisePluginContainer (C:\Users\PranayKumar\AppData\Roaming\npm\node_modules\babel-cli\node_modules\babel-core\lib\transformation\file\options\option-manager.js:113:13)
at Function.normalisePlugin (C:\Users\PranayKumar\AppData\Roaming\npm\node_modules\babel-cli\node_modules\babel-core\lib\transformation\file\options\option-manager.js:146:32)
at C:\Users\PranayKumar\AppData\Roaming\npm\node_modules\babel-cli\node_modules\babel-core\lib\transformation\file\options\option-manager.js:184:30
at Array.map (<anonymous>)
at Function.normalisePlugins (C:\Users\PranayKumar\AppData\Roaming\npm\node_modules\babel-cli\node_modules\babel-core\lib\transformation\file\options\option-manager.js:158:20)
at OptionManager.mergeOptions (C:\Users\PranayKumar\AppData\Roaming\npm\node_modules\babel-cli\node_modules\babel-core\lib\transformation\file\options\option-manager.js:234:36)
at OptionManager.init (C:\Users\PranayKumar\AppData\Roaming\npm\node_modules\babel-cli\node_modules\babel-core\lib\transformation\file\options\option-manager.js:368:12)
at File.initOptions (C:\Users\PranayKumar\AppData\Roaming\npm\node_modules\babel-cli\node_modules\babel-core\lib\transformation\file\index.js:212:65)
at new File (C:\Users\PranayKumar\AppData\Roaming\npm\node_modules\babel-cli\node_modules\babel-core\lib\transformation\file\index.js:135:24)
at Pipeline.transform (C:\Users\PranayKumar\AppData\Roaming\npm\node_modules\babel-cli\node_modules\babel-core\lib\transformation\pipeline.js:46:16)
at transform (C:\Users\PranayKumar\AppData\Roaming\npm\node_modules\babel-cli\lib\babel\util.js:50:22)
at Object.compile (C:\Users\PranayKumar\AppData\Roaming\npm\node_modules\babel-cli\lib\babel\util.js:59:12)
at write (C:\Users\PranayKumar\AppData\Roaming\npm\node_modules\babel-cli\lib\babel\dir.js:21:21)
at handleFile (C:\Users\PranayKumar\AppData\Roaming\npm\node_modules\babel-cli\lib\babel\dir.js:43:7)
at C:\Users\PranayKumar\AppData\Roaming\npm\node_modules\babel-cli\lib\babel\dir.js:61:9
at Array.forEach (<anonymous>)
at handle (C:\Users\PranayKumar\AppData\Roaming\npm\node_modules\babel-cli\lib\babel\dir.js:59:29)
at Array.forEach (<anonymous>)
at module.exports (C:\Users\PranayKumar\AppData\Roaming\npm\node_modules\babel-cli\lib\babel\dir.js:69:15)
at Object.<anonymous> (C:\Users\PranayKumar\AppData\Roaming\npm\node_modules\babel-cli\lib\babel\index.js:129:1)
at Module._compile (internal/modules/cjs/loader.js:702:30)

npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! [email protected] build: mkdir build && babel server/ -d build/server --ignore ./server-entry.js npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the [email protected] build script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\PranayKumar\AppData\Roaming\npm-cache_logs\2018-09-22T18_07_48_781Z-debug.log

Below are my files.

package.json

  "scripts": {
    "start": "pm2 start ./pm2-prod.json",
    "build": "mkdir build && babel src/server/ -d build/server --ignore ./src/server/server-entry.js",
    "server": "pm2 start ./pm2-dev.json --no-daemon",
    "build-webpack": "webpack --config webpack.config.client.js",
    "client": "webpack-dev-server --config webpack.config.client.js --open"
  },
  "devDependencies": {
    "@babel/core": "^7.1.0",
    "@babel/plugin-proposal-class-properties": "^7.0.0",
    "@babel/plugin-proposal-decorators": "^7.0.0",
    "@babel/plugin-proposal-export-namespace-from": "^7.0.0",
    "@babel/plugin-proposal-function-sent": "^7.0.0",
    "@babel/plugin-proposal-json-strings": "^7.0.0",
    "@babel/plugin-proposal-numeric-separator": "^7.0.0",
    "@babel/plugin-proposal-throw-expressions": "^7.0.0",
    "@babel/plugin-syntax-dynamic-import": "^7.0.0",
    "@babel/plugin-syntax-import-meta": "^7.0.0",
    "@babel/polyfill": "^7.0.0",
    "@babel/preset-env": "^7.1.0",
    "@babel/preset-react": "^7.0.0",
    "@babel/register": "^7.0.0",
    "babel-core": "^6.26.3",
    "babel-loader": "^7.1.5"
  }

server-side.babelrc

{
    "presets": [
        [
            "@babel/preset-env",
            {
                "targets": {
                    "node": "current"
                }
            }
        ]
    ],
    "plugins": [
        "@babel/plugin-proposal-object-rest-spread"
    ]
}

server-entry.js

require('@babel/register');
require('./server.js');

Answer 1

As shown in the stack trace, Babel is being called via babel-cli, which is a problem because babel-cli is the Babel 6.x CLI. You also don't have babel-cli anywhere in your devDependencies list.

For Babel 7, you'll want to:

• install @babel/cli
• make sure that you remove any installed babel-cli version that is already there
• Make sure you're actually compiling your files with the babel command from your local project, not a globally-installed version.