这是我参与「第四届青训营」笔记创作活动的的第12天.
今天我们要学习的是 Webpack是什么，用举例说明它的打包核心流程；Entry => Dependencies Lookup => Transform=> Bundle => Output.它有两个关键配置项Loader 组件和Plugin 组件，老师们也讲述了学习web pack的进阶之路，从入门开始我们要学会灵活应用，然后慢慢开始学会扩展 Webpack，最后自己要有对于源码级理解 以及对于webpack 打包编译原理的深刻解读.
web pack本质上是一种前端资源编译、打包工具，它把海量资源文件打包成一个 Bundle，同时支持 Babel、Eslint、TS CoffeScript、Less、Sass.有处理模块化处理css、图片 等资源文件和支持 HMR ＋ 开发服务器的能力，同时它也支持持续监听、持续构建.可以实现代码分离，support Tree-shaking和Sourcemap.
它的核心procedure：首先进行入口处理，从entry 文件开始，启动编译流程.下一步是依赖解析，从entry文件开始根据 require 或者 import等语句找到依赖资源.然后开始资源解析，根据module配置，调用资源转移器，将png、css 等非标准JS资源转译为 JS 内容.最后把资源合并打包将转译后的资源内容合并打包为可直接在浏览器运行的JS文件.然后是关于 Webpack 的使用方法，基本都围绕配置展开进行，大致上这些配置大致可划分为两类，一个是流程类，作用于流程中某个 or 若干个环节，直接影响打包效果的配置项.一个是工具类，主流程之外，提供更多工程化能力的配置项.
本节课浅显易懂但干货满满，无论是应用tips还是组件开发，又或是Webpack 构建流程的基本原理剖析，老师们输出了一套学习方法论，帮助我们可以进一步搭建 Webpack 知识体系。
