webpack - day01

模块化： 开发维护方便，按功能分成各个单独的代码块，代码块内有独立的作用域互不影响，通过 module 或 exports对象暴露接口，不污染全局变量；

　　　　模块化的一个直接副作用，把应用程序拆分成多个独立的文件，需要加载多个文件（文件加载时间长）

打包工具出现：webpack 及 rullup 是模块打包器，将小块代码编译成合并在一起，附带代码压缩等功能

　　　　　　　rollup 将小块代码编译成大块复杂的代码，例如 library 或应用程序  （es6， 提出 tree-shaking） 

　　　　　　　webpack静态模块打包器，主要目标是将 JavaScript 文件打包在一起，生成静态文件，在浏览器中使用

（模块化解决了怎么写代码的问题；webpack解决了在模块思想下代码合并的问题；）

概念： webpack处理应用程序时，它会递归地构建一个依赖关系图（dependency graph），然后将所有这些模块打包成一个或多个 bundle。

四个核心概念：

　　入口 entry     ---> 构建其内部依赖图的开始    默认值 ./src

　　输出 output   ---> 哪里输出，以及如何命名这些文件 ./dist

　　loader       ---> 转换非js 类型的模块（webpack只理解js文件）

　　插件plugins   ---> 扩展webpack自身的功能 （从打包优化和压缩，一直到重新定义环境中的变量）

webpack  （两种使用方法： 终端 或 nodejs）  

　　　　配置文件遵守 CommonJS 规范；  

　　　　导出文件： module.exports = {}

　　　　加载模块： require() 

webpack.config.js  配置文件