webpack 构建失败：明显的依赖不匹配，如何解决？

Question

我正在将一个大型项目转换为 webpack，但遇到了一个构建错误（实际上是不同的错误，具体取决于我尝试解决的方式）。我对 webpack 还不是很熟练，希望对此类问题的典型解决方案有所帮助。

某些依赖项之间似乎存在冲突：

"@babel/core": "^7.0.0-beta.42",
"@babel/preset-env": "^7.0.0-beta.42",
"backbone.radio": "2.0.0",

Webpack 抱怨：Cannot find module 'babel-preset-es2015'。看起来 backbone.radio 有一个带有 "presets": ["es2015"] 的 .babelrc 文件，babel 似乎试图尊重它，即使它是一个依赖项，但它将 babel-preset-env 列为一个 devDependency，所以它没有找到。

好的，所以我尝试将 babel-preset-es2015@6.3.13（与 backbone.radio 引用的相同）显式安装为顶级依赖项，以便可以找到它。然后它找到了它，但是 webpack（或者真正的 babel）抱怨：Error: Plugin/Preset files are not allowed to export objects, only functions.

很好，所以我尝试安装与 babel 7 兼容的更新版本的预设，希望与 backbone.radio 兼容。似乎名称已更改，所以我安装了@babel/preset-es2015@7.0.0-beta.42。当然名称不匹配，所以我添加了一个 webpack 别名，但这不起作用，仍然找不到；我想 babel 不会使用 babel 加载预设依赖项，而是自己加载。

所以现在我卡住了。人们通常会做什么来解决这些问题？我还没有确定的其他潜在想法是可能的：

告诉 babel（以某种方式？）将 babel-preset-es2015 别名为 @babel/preset-es2015?
将 yarn（以某种方式？）配置到 omit/remove backbone.radio 的 .babelrc 文件（如果该文件不存在，问题就会完全消失，但我不能只是从 node_modules当然一直都是）

Answer 1

在 node_modules 中编译东西在 Babel 6 最初的生命周期中并不是真正的东西，所以它可能很痛苦。直到最近，我们明确建议用户在他们的 babel-loader 配置中设置 exclude: /node_modules/，因为它曾经并且仍然对任意第三方代码上的运行 Babel 有点危险。

对于您的具体问题，您有两种选择：

使用 exclude: /node_modules/ 让 Babel 只处理你自己的代码。
升级到 beta.46，因为我们现在添加了 first-class 对 Node 包概念的支持，这是我们以前没有的。 Babel >= beta.45 只会搜索 "root" 包中的 .babelrc 个文件。

我还要补充一点，如果你的 Babel 配置现在在 .babelrc 中，那不会影响 node_modules 中的东西，所以如果你打算编译第三方代码，您需要将配置移动到项目根目录中的 babel.config.js 文件，或者直接将其放入 webpack.config.js 中。您可能还想明确地将 sourceType: 'unambiguous' 作为 Babel 选项传递。

最后，如果您使用的是测试版，我们绝对仍在进行重大更改，因此您不应在 package.json 中使用 ^，因为那样会使您使用最新的一切的版本，与早期版本相比我们可能已经破坏了。

webpack 构建失败：明显的依赖不匹配，如何解决？

webpack build failing: apparent dependency mismatches, how to resolve?

webpack

babeljs

yarnpkg