webpack初始

介绍

webpack是一个模块打包工具 ，可以将任何前端资源视为模块，如css，图片，文本
其输入为：包含依赖关系的模块集
其输出为： 打包合并的前端静态资源

为什么引入新的打包工具？？

web前端工程复杂，一个webapp对于业务代码的要求很多：
1. 代码可以分块，实现按需加载；
2. 首屏加载时间要尽量减少；
3. 需要继承一些第三方库；
webpack之前的打包工具功能单一，只能完成特定任务。然而对于模块打包工具，单一的支持commonJS的打包在大型项目中是不够的，为了满足大型项目的前端需求，一个打包工具应该包含一些功能：
1. 支持多个bundler输出，解决代码分块问题；
2. 异步加载，按需加载，优化首屏加载时间；
3. 可定制化，可以继承第三方库，可以定制话打包过程
4. 其他资源也可以定义为模块

webpack提供的功能：
1. 代码分块：有两种类型的模块依赖，一种同步的，一种异步的。在打包的过程中可以将代码输出为代码块（chunk），代码块可以实现按需加载
2. Loaders：webpack本身只会处理js，为实现其他资源的模块定义，并转化为js，webpack需要定义loaders，不同的loader可以将对应的资源转化为js模块
3. 智能的模块解析： webpack 可以很容易将第三方库转化为模块集成到项目代码中，模块的依赖可以用表达式的方式（这在其他打包工具中是没有支持的），这种模块依赖叫做动态模块依赖。