使用 Webpack4、Babel、React 构建模块失败

Question

我不断收到错误：

 Module build failed (from ./node_modules/babel-loader/lib/index.js):
Error: Duplicate plugin/preset detected.
If you'd like to use two separate instances of a plugin,
they need separate names, e.g.

  plugins: [
    ['some-plugin', {}],
    ['some-plugin', {}, 'some unique name'],
  ]

这是我的 babelrc 及其要求的更改：

{
"presets": [
  ["@babel/env"],
  ["@babel/preset-react"]
],
"plugins": [
    ["@babel/plugin-syntax-jsx"],
    ["@babel/plugin-transform-react-jsx"],
    ["@babel/plugin-transform-react-display-name"],
    ["@babel/plugin-transform-react-jsx-self"],
    ["@babel/plugin-transform-react-display-name"]
  ]

}

不确定我在哪里有错误的文件语法。这也是我第一次使用 babel 为 react 应用程序配置 webpack4。请让我知道如果一切看起来都很好，可以与 react 一起使用。

Answer 1

就像错误所说：你有一个重复。 ["@babel/plugin-transform-react-display-name"] 在您的“插件”数组中两次。删除其中一个即可。

---

话虽如此：看看preset-react 中已经包含的内容（预设是预定义的插件包）。所有这些插件都已包含在内（尽管“plugin-transform-react-jsx-self”是一个选项。）