升级 Laravel Mix 以使用 Babel 7

Question

我需要更新 Laravel mix 才能使用 Babel 7。

我更新了我的依赖项以使用应该支持 Babel 7 的 Laravel Mix 4.0.7。

  "devDependencies": {
    "@babel/core": "^7.2.2",
    "@babel/plugin-proposal-class-properties": "^7.2.1",
    "@babel/preset-env": "^7.2.0",
    "@babel/preset-react": "^7.0.0",
    "axios": "^0.15.3",
    "babel-loader": "^7.1.5",
    "bootstrap": "4.1.3",
    "browser-sync": "^2.26.3",
    "browser-sync-webpack-plugin": "^2.0.1",
    "jquery": "^3.1.1",
    "laravel-mix": "^4.0.7",
    "less": "^3.9.0",
    "less-loader": "^4.1.0",
    "lodash": "^4.17.10",
    "react-color": "^2.14.1",
    "resolve-url-loader": "^2.3.1",
    "sass": "^1.15.2",
    "sass-loader": "^7.1.0",
    "styled-components": "^4.0.3",
    "vue": "^2.5.13"
  }

在我的 .babelrc 文件中，我有：

{
  "loader": "babel-loader",
  "presets": ["@babel/preset-env", "@babel/preset-react"],
  "plugins": [
    "@babel/plugin-proposal-object-rest-spread",
    "@babel/plugin-proposal-class-properties",
    "@babel/plugin-transform-react-jsx"
  ]
}

在我的 webpack.mix.js 中，我有：

mix.react("resources/assets/app.js", "public/js");

问题是当我运行 npm run watch 时出现以下错误：

模块构建失败（来自 ./node_modules/babel-loader/lib/index.js）：错误：找不到模块“babel-core”

显然，Laravel Mix 正在尝试使用 babel-core 而不是 @babel/core。

关于如何解决这个问题的任何想法？

Answer 1

我相信你需要将 babel-loader 升级到 8.x。

如果您在https://www.npmjs.com/package/babel-loader阅读文档

这个 README 适用于 babel-loader v8 + Babel v7

使用 Babel v6 检查 7.x 分支的文档

所以，babel-loader 8.x 与 @babel-core 7 一起工作。 babel-loader 7.x 与 babel-core 6.x 一起工作