webpack核心概念
entry: 编译入口
module: 模块，在 webpack 中，一切皆为模块，一个模块对应一个文件
Chunk: 代码块，一个 chunk 由多个模块组合而成，用于代码的合并与分割
Loader: 模块转换器，将非js模块转化为webpack能识别的js模块
Plugin: 扩展插件，在webpack运行的各个阶段，都会广播出去相对应的事件，插件可以监听到这些事件的发生，在特定的时机做相对应的事情
webpack核心对象
Tapable：控制钩子的发布与订阅，Compiler和Compilation 对象都继承于 Tapable
Compiler
Compiler 继承 Tapable 对象，可以广播和监听 webpack 事件。
Compiler 对象是 webpack 的编译器，webpack 周期中只存在一个 Compiler 对象。
Compiler 对象在 webpack 启动时创建实例，compiler 实例中包含 webpack 的完整配置，包括 loaders, plugins 信息。
Compilation
Compilation 继承 Tapable 对象，可以广播和监听 webpack 事件。
Compilation 实例仅代表一次 webpack 构建和生成编译资源的的过程。
webpack 开发模式开启 watch 选项，每次检测到入口文件模块变化时，会创建一次新的编译: 生成一次新的编译资源和新的 compilation 对象，这个 compilation 对象包含了当前编译的模块资源 module, 编译生成的资源，变化的文件, 依赖的的状态
webpack基本概念
1. webpack中的module，chunk 和 bundle
module 就是一个js模块，就是被require或export的模块，例如 ES模块，commonjs模块，AMD模块
chunk 是 代码块，是进行依赖分析的时候，代码分割出来的代码块，包括一个或多个module，是被分组了的module集合，code spliting之后的就是chunk
bundle 是 文件，最终打包出来的文件，通常一个bundle对应一个chunk
2. webpack中loader和plugin在作用
loader是文件转换器，将webpack不能处理的模块转换为webpack能处理的模块，就是js模块
plugin是功能扩展，干预webpack的打包过程，修改编译结果或打包结果
webpack打包流程
1. 生成options (将webpack.config.js和shell中的参数，合并中options对象)
2. 实例化complier对象 （webpack全局的配置对象，包含entry，output，loader，plugins等所有配置信息）
3. 实例化Compilation对象 (compiler.run方法执行，开始编译过程，生成Compilation对象)
4. 分析入口js文件，调用AST引擎(acorn)处理入口文件，生成抽象语法树AST，根据AST构建模块的所有依赖
5. 通过loader处理入口文件的所有依赖，转换为js模块，生成AST，继续遍历，构建依赖的依赖，递归，直至所有依赖分析完毕
6. 对生成的所有module进行处理，调用plugins，合并，拆分，生成chunk
7. 将chunk生成为对应bundle文件，输出到目录
webpack热更新的原理
基本原理，webpack监听文件变化，服务端和客户端有websocket通信，服务端想客户端发送文件变化消息，
客户端根据文件变化消息获取变更模块代码，进行模块代码的热替换
1. 配置开启热更新，设置entry格式和webpack-dev-server的option，使得打包的bundle里面包含HMR runtime和websocket连接的代码
2. webpack-dev-server通过express启动服务端
3. 客户端通过sockjs和服务端建立websocket长连接
4. webpack监听文件变化，文件保存触发webpack重新编译，编译后的代码保存在内存中，不在output.path中产生输出
5. 编译会生成hash值，hot-update.json(已改动模块的json)，hot-update.js(已改动模块的js)
6. 通过socket想客户端发送hash值
7. 客户端对比hash值，一致在走缓存，不一致则
通过ajax获取hot-update.json，json包含模块hash值
再通过jsonp请求获取hot-update.js
8. 热更新js模块，若失败，则live reload刷新浏览器代替热更新（若模块未配置热更新，则同样live reload）