我正在将一些存储库迁移到一个使用 yarn workspaces 和 Lerna 的 monorepo。这些包大致如下所示:
|-- packages
|-- app
|-- components-1
|-- components-2
app
与 webpack 捆绑在一起。它包括 components-1
和 components-2
作为依赖项,以及 React 15.3.2。
components-1
包含 React 15.6.1 的对等依赖项。所以它有 React 15.6.1 是一个开发依赖。这是从该包中运行 react-styleguidist 和测试所必需的,并且主要是它作为单独的存储库存在的工件,预迁移。
看起来,因为有两个版本的 React,webpack 会捆绑它们,因为它们都在不同的位置成功解析。 React 15.3.2 安装在存储库的根级 node_modules
中,而 React 15.6.1 安装在 components-1/node_modules
中。
正如人们所料,ReactDOM 也会发生同样的情况。
我的解决方案是在应用程序的 webpack 配置中为 react
和 react-dom
定义别名:
resolve: {
alias: {
'react': path.resolve('../../node_modules/react'),
'react-dom': path.resolve('../../node_modules/react-dom'),
},
}
但这对我来说似乎有点 hacky,因为它只能在这个 yarn 工作区设置中工作。
我想知道是否有更好的方法来做到这一点,无论是在应用程序的 webpack 配置中,还是在某种 yarn 工作区配置中。
最佳答案
webpack 根据其文件路径确定模块的唯一性。因此,如果你有两个 react 副本,来自两个单独的节点模块路径,那么是的,webpack 将捆绑两者。但是,如果您说您正在使用 yarn workspaces,这应该意味着您的 monorepo 应该只有一个 node_modules
文件夹。
关于webpack - 在 yarn workspaces 中配置 webpack,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56083057/