为什么 webpack 会捆绑额外的文件？答案

【问题标题】：Why is webpack bundling extra files?为什么 webpack 会捆绑额外的文件？
【发布时间】：2020-10-23 14:37:10
【问题描述】：

我创建了一个简单的github repo 来重现我的场景。

我有 2 个配置文件：根据 NODE_ENV 值使用的 dev.vue.config.js 和 prod.vue.config.js

对于 prod，我的 webpack 入口点设置为

configureWebpack: {
    entry: {
      activitySubmit: './src/as-setup.js'
    }
  }

我还使用 SplitChunks 插件将 node_modules 捆绑到 vendor.js 中，所以我希望 webpack 生成 2 个文件：activitySubmit.js 和 vendors.js

但是我也得到了第三个文件 app.js，它的内容是 src/main.js 但是为什么？我没有将它指定为我的入口点，也没有其他文件从 main.js 导入任何内容，那为什么还要捆绑它呢？我在产品中不需要它。

现在，如果我将入口点更改为

configureWebpack: {
    entry: {
      app: './src/as-setup.js'
    }
  }

我得到 2 个文件：app.js 和 vendors.js

如果我检查 app.js，我可以看到它现在不包含来自 src/main.js 的代码（如预期的那样）。我很困惑，请帮忙解释一下逻辑

【问题讨论】：

【解决方案1】：

这个问题在 Vue 论坛上得到了回答，所以我也在这里发布了答案

跑步

vue inspect --mode production

将显示 Vue CLI 正在生成的 Webpack 配置。最后是：

entry: {
  app: [
    './src/main.js'
  ],
  activitySubmit: './src/as-setup.js'
}

因为如vue docs 中所述，您在configureWebpack 中提供的配置是使用webpack-merge 合并的，因此默认条目仍然存在。

【讨论】：