使用Webpack直接解析兄弟NPM项目时,如何指定一个解析顺序,以便首先查看哪个node_modules?

时间:2017-01-09 19:47:30

标签: npm webpack

我有两个npm项目,project-aproject-b。他们既可以发布也可以直接依赖我公司的任何npm项目。 project-a取决于project-b。他们都是同一个Git回购中的兄弟姐妹。

我想直接将project-b中的某些组件导入project-a。我非常接近 - 通过在resolve.alias中指定project-a看起来像project-b: path.resolve(__dirname, '../project-b/entrypoint.js'),我可以提供entrypoint.js提供的内容。但是,当Webpack尝试解析entrypoint导入的内容时,它首先在project-b/node_modules中查找。这是一个问题有两个原因:我们使用React,因此这会引入React(project-a/node_modules/reactproject-b/node_modules/react)的多个副本,React用户知道这些副本会破坏用户界面,同样也会提取多个副本任何共享依赖关系,其中有很多,导致project-a的Webpack工件中存在大量其他良性膨胀。

我的预感是必须有一种方法可以告诉webpack,在解决project-b中的导入时,首先查看project-a,然后再继续查看project-b。通过这种方式,它首先会在project-a/node_modules中查找react导入语句是在project-a还是project-b,导致只有project-a/node_modules个共享副本project-a工件中的依赖项,同时成功地允许解析唯一的project-b依赖项/组件。我已经和resolve.rootresolve.modulesDirectoriesresolve.fallback一起玩了很多,但是我们无法实现我想要的目标。

有什么想法吗?

1 个答案:

答案 0 :(得分:0)

我在我的项目中遇到了类似的问题,同时包含了多个React副本。

解决方案非常简单 - 将其添加到resolve密钥下的webpack(版本2)配置中:

modules: [path.resolve(__dirname, "node_modules"), "node_modules"]

这指示webpack在构建目录中的node_modules中解析,然后在其他目录中解析node_modules。在您的情况下,这应该意味着从project-a/node_modules而不是project-b/node_modules抓取模块。

您可以找到更多文档here