Question

我设置了一个具有2个子模块依赖项的父模块。父模块没有指定的jQuery依赖关系，但是每个子模块都将jQuery ^ 3.3.1指定为依赖关系（每个子模块的结果为3.4.1）。我对父模块进行了Webpack，然后在生成的捆绑文件中看到jQuery 3.4.1被两次包含。我应该怎么做才能使同一版本的jQuery不被包含两次？我确实尝试了splitchunks插件，它确实生成了块，但jQuery仍然存在两次。我认为Webpack应该自动分析模块图中的依赖关系并优化捆绑的代码？我尚未测试NPM对等项依赖性或Webpack重复数据删除插件。我还想知道jQuery本身是否存在Webpack无法/决定不自动重复数据删除的地方？

在两个子模块的index.js文件中，我正在使用：

import $ from "jquery"

在每个子模块的package.json中，我指定了：

"dependencies": {
"jquery" : "^3.3.1"
}

然后我在每个子模块上进行了npm安装。

Answer 1

/my-module/my-controller/my-session-updater-action

请注意，因为Shariff 1.24.1将module.exports = { resolve: { alias: { // fix every jQuery to our direct jQuery dependency. Shariff 1.24.1 brings its own jQuery and it would be included twice without this alias. 'jquery': __dirname + '/node_modules/jquery/', }, }, };定义为自己的依赖项，而不是在jQuery中将其定义为对等项依赖。

Refrence

Answer 2

我发现模块解析可以自动发生在入口点文件夹的下方（进入子文件夹），而不是向上发生（在入口点文件夹之外的模块文件夹中）。我发现我需要通过在Webpack.config中添加“ resolve”对象来“告知” Webpack有关其他模块的位置：

resolve: {
        modules: [
          path.resolve(__dirname, "src/modules/pagetype/node_modules"),
          path.resolve(__dirname, "src/modules/sitewide/node_modules"),
          path.resolve(__dirname, "src/modules/template/node_modules"),
          "node_modules"
        ]
      }, // resolve

为什么我的Webpack捆绑包两次包含jQuery？

2 个答案: