什么是webpack Webpack是一个现代JavaScript应用程序的静态模块打包器。它把你的项目当做一个整体，通过给定的入口文件开始找到你的项目所有依赖模块，使用loaders处理它们，最后打包为一个或多个浏览器可识别的JavaScript文件，可以减少页面请求，优化网页性能。
如何使用Webpack 一、安装node JS (webpack在执行打包压缩的时候是依赖nodejs的)，请参考node JS官网进行下载安装 二、初始化一个node js模块 1、创建一个目录并在终端中进入当前目录执行npm init -y 2、安装webpack和webpack-cli(命令行工具)： npm install webpack webpack-cli --save-dev 或者使用淘宝镜像安装,请直接百度“npm 淘宝镜像”，安装过淘宝镜像后再安装其他安装包时可直接把上面命令行的npm替换成cnpm 三、打开webpack.config.js文件，定义入口和输出 四、在package.json文件中添加一个npm脚本，这样运行本地的webpack比较方便 五、在终端中运行 npm run build 就可以在dist文件夹下生成打包后的bundle.js文件 webpack处理第三方文件类型的过程 1.发现这个要处理的文件不是JS文件，然后就去配置文件中，查找有没有对应的第三方loader规则 2.如果能够找到对应的规则，就会调用对应的loader处理这种文件类型 3.在调用loader的时候，是从后往前调用的，比如本例中就是先调用css-loader，再调用style-loader 4.当最后的一个loader调用完毕，会把处理的结果直接交给webpack进行打包合并，最终输出到bundle.js中去 px：像素 em：一个M的宽度或者一个汉字的宽度。 ex：一个X的高度。 rem：root em根元素的font-size的大小，（根元素html元素,html的font-size：16px；那么rem就是16px）。 vh：viewport视口高度。100vh = 视口高度。 vw：viewport width视口宽度。100vw = 视口宽度。
