Webpack 如何确定要包含在其 bundle 中的内容？

Question

假设我有一个具有以下结构的项目

/app
|_webpack.config.js
|_package.json
|_/npm_modules
| |_...
|_/client
  |_/misc
  | |_...
  |_/components
  | |_...
  |_index.jsx

并webpack.config.js包含这个

entry: ["./client/index.jsx"]

并index.jsx像这样加载所有组件

var components = [];
var componentPaths = require.context("./components", false);
componentPaths.keys().forEach(function(path)  {
    components.push(componentPaths(path));
});

哪些文件将被捆绑到生成的 bundle.js 中？
它只是/app/client/index.jsx和目录中的所有文件/app/client/components吗？
还是会/app/client捆绑整个目录（包括 下的所有内容/app/client/misc）？
还是会/app捆绑整个目录（包括 下的所有内容/app/npm_modules）？

我一直试图根据 Webpack 文档来解决这个问题，但它们是不够的。如果您知道答案，包括对您在哪里找到信息的参考将非常有帮助。

我之所以这么问是因为我想设置一个具有多个入口点的项目，其中生成的 bundle.js 文件只包含必要的内容。

Answer 1

因为您使用import或require。如果未导入或不需要文件，则不会将其包含在捆绑包中。

它解释here。

注意：import是一个 ES6 特性，你需要 Babel 才能在大多数浏览器中使用它。