模块构建失败 babel-loader 意外令牌“<”答案

【问题标题】：Module build failed babel-loader Unexpected token "<"模块构建失败 babel-loader 意外令牌“<”
【发布时间】：2020-06-25 15:05:26
【问题描述】：

这里和 github 上似乎有无数个问题在问这个问题，但没有一个解决方案适合我。我只是想更新一个旧项目，但我一直收到这个错误：

Module build failed (from ../node_modules/babel-loader/lib/index.js):

SyntaxError: /Users/user/Documents/project/src/index.js: Unexpected token (5:16)

意外的令牌是“ReactDOM.render("<"App />, ...);

package.json:

"devDependencies": {
  "@babel/core": "^7.10.3",
  "@babel/preset-env": "^7.10.3",
  "@babel/preset-react": "^7.10.1",
  "babel-loader": "^8.1.0",
  ...
}

webpack 配置：（webpack 4.43.0）

module: {
  rules: [
    {
      test: /\.js$/,
      exclude: /node_modules/,
      loader: 'babel-loader',
    },
  ...
  ],
}

.babelrc:

{
"presets": [
  "@babel/preset-env",
  "@babel/preset-react"
  ]
}

就上下文而言，旧的 babel 包工作得很好。

这个问题还有其他解决方案吗？

【问题讨论】：

标签： reactjs webpack babeljs babel-loader

【解决方案1】：

看起来很标准。从 babel v6 t v7 升级后出现问题，必须从 .babelrc 切换到清除缓存文件的配置文件。为了快速试用，您可以在 webpack 中添加它并尝试

loader: 'babel-loader',
            options: {
                presets:["@babel/preset-env","@babel/preset-react" ]
            },

【讨论】：