升级到Babel 7后出错:需要Babel "^7.0.0-0"，但加载的是"6.26.3“

Question

我使用https://github.com/babel/babel-upgrade升级到了Babel 7，现在出现了一个与grunt/browserify相关的错误。

在grunt文件中：

browserify: {
  options: {
    watch: true,
    transform: [['babelify', {
      presets: ['@babel/preset-env', '@babel/preset-react'],
      plugins: [
        ['@babel/plugin-transform-react-jsx', {'pragma':'h'}]
      ],
    }]],
    browserifyOptions: {
      standalone: 'Viewer', // Set name of package as window global when no package system is present
      debug: true           // Enables Source Maps
    }
  },
  all: {
    options: {
      watch: true,          // Listen for incremental changes to files (fast incremental build)
    },
    files: {
      ...
    }
  }
} . . .

我在'browserify:all‘上得到以下错误：

错误:需要Babel "^7.0.0-0"，但加载的是"6.26.3“。如果您确定您有一个兼容版本的@babel/core，则很可能是构建过程中的某些内容加载了错误的版本。检查此错误的堆栈跟踪，查找没有提到"@ Babel /core“或"babel-core”的第一个条目，以查看调用Babel的是什么。(处理预设时："XXXX")解析文件时："XXXXXX“

有没有人能帮我解决这个问题？

package.json：

 "devDependencies": {
"@babel/core": "^7.0.0",
"@babel/plugin-proposal-class-properties": "^7.0.0",
"@babel/plugin-proposal-decorators": "^7.0.0",
"@babel/plugin-proposal-do-expressions": "^7.0.0",
"@babel/plugin-proposal-export-default-from": "^7.0.0",
"@babel/plugin-proposal-export-namespace-from": "^7.0.0",
"@babel/plugin-proposal-function-bind": "^7.0.0",
"@babel/plugin-proposal-function-sent": "^7.0.0",
"@babel/plugin-proposal-json-strings": "^7.0.0",
"@babel/plugin-proposal-logical-assignment-operators": "^7.0.0",
"@babel/plugin-proposal-nullish-coalescing-operator": "^7.0.0",
"@babel/plugin-proposal-numeric-separator": "^7.0.0",
"@babel/plugin-proposal-optional-chaining": "^7.0.0",
"@babel/plugin-proposal-pipeline-operator": "^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/plugin-transform-react-jsx": "^7.3.0",
"@babel/preset-env": "^7.0.0",
"@babel/preset-react": "^7.0.0",
"babel-core": "^7.0.0-bridge.0",
"babel-jest": "^23.6.0",
"grunt-browserify": "^5.3.0",
"jest": "^23.5.0",
"jsdom": "^12.1.0"

},

"dependencies": {
"@tweenjs/tween.js": "^17.3.0",
"autoprefixer": "^6.7.5",
"babelify": "^7.3.0",
"browserify": "^13.1.0",
"cssnano": "^3.10.0",
"diff-arrays-of-objects": "^1.1.2",
"eslint": "^3.7.1",
"eslint-plugin-react": "^6.10.3",
"filesize": "^3.6.1",
"grunt": "^1.0.2",
"grunt-contrib-uglify-es": "^3.3.0",
"grunt-contrib-watch": "^1.0.0",
"grunt-env": "^0.4.4",
"grunt-eslint": "^19.0.0",
"grunt-open": "^0.2.4",
"grunt-postcss": "^0.8.0",
"grunt-sass": "^2.1.0",
"mathjs": "^5.4.0",
"p-queue": "^3.0.0",
"preact": "^8.2.7",
"preact-range-slider": "^0.2.0",
"preact-redux": "^2.0.1",
"redux": "^3.6.0",
"redux-logger": "^3.0.6",
"redux-thunk": "^2.2.0",
"redux-undo": "^1.0.0-beta9-9-7",
"tslib": "^1.9.0",
"tween": "^0.9.0"

}

Answer 1

1-删除节点模块

npm install rimraf -g
rimraf node_modules

2-将核心升级到"babelify": "^9.0.0" (Babelify 7.3.0加载babel- "babelify": "^7.3.0" v6.26.3)

3-将"babel-preset-es2015"和"babel-preset-react更改为

"@babel/preset-env": "^7.5.5",
"@babel/preset-react": "^7.0.0"

(如果您使用它们)

4-在.babelrc中，将"presets": ["react", "es2015"]更改为"presets": ["@babel/preset-env", "@babel/preset-react"] (如果使用它们)

5-npm install

Answer 2

尝试删除您的node_modules文件夹，然后重新运行npm install -这应该会删除您使用旧版本时的所有依赖项剩余。

Answer 3

当你运行你的grunt文件时，它正在寻找babel-register。然而，对于babel 7.0.0和更高版本，您需要它来查找@babel/register。所以你需要安装@babel/register，它不需要你做任何进一步的操作就可以工作。

npm install --save-dev @babel/register