共计 941 个字符，预计需要花费 3 分钟才能阅读完成。
官网：https://www.webpackjs.com/
核心原理
一切皆模块
按需加载
概念
module
具有一定功能的模块。
bundle
打包后的文件。
chunk
打包过程分割的代码块。
Entry
Webpack 会递归的探索出 入口文件中所依赖的模块，并按照顺序 利用 Loader 进行处理。
方式
单入口
1.string
entry: “app.js”;
多入口
1.Array<string> 数组中的每一项都会被打包，形成互不依赖的文件
entry: [“app.js”,”main.js”];
2.object
entry: {
[entryChunkName]: string | Array<string>
}
对象中的每一个属性都会被打包，形成互不依赖的文件
entry: {
index:[‘index.js’,’app.js’],
vendor: ‘vendor.js’
}
Output
即是你配置了多个入口文件，你也只能有一个输出点。
path
输出文件的目录。
绝对路径
filename
输出的文件名，它一般跟你 entry 配置相呼应。
单入口
自定义
filename: “[name].bundle.js”
多入口
[name].js
[id].js, 使用内部 chunk id
[hash].js, 使用每次构建过程中，唯一的 hash 生成
在项目中任何一个文件改动后就会被重新创建，然后 webpack 计算新的 hash 值
[chunkhash].js, 使用基于每个 chunk 内容的 hash
publicPath
公共资源路径
publicPath 应该以 / 结尾，同时其它 loader 或插件的配置不能以 / 开头
chunkFilename
块，配置了它，非入口 entry 的模块，会帮自动拆分文件，也就是大家常说的按需加载，与路由中的 require.ensure 相呼应。
resolve
配置模块如何解析。extensions：自动解析确定的扩展, 省去你引入组件时写后缀的麻烦，alias：非常重要的一个配置，它可以配置一些短路径，
module.rules – 编译规则
rules：也就是之前的 loaders，test：正则表达式，匹配编译的文件，exclude：排除特定条件，如通常会写 node_modules，即把某些目录 / 文件过滤掉，include：它正好与 exclude 相反，
