写在前面：
webpack依赖于nodejs，nodejs需要npm（相当于maven）包管理工具，国内使用npm下载包比较慢，需要下载淘宝镜像cnpm
webpack:
Webpack 是一个前端资源的打包工具，它可以将js、image、css等资源当成一个模块进行打包。
使用webpack的好处：
1、模块化开发
程序员在开发时可以分模块创建不同的js、 css等小文件方便开发，最后使用webpack将这些小文件打包成一个文 件，减少了http的请求次数。
webpack可以实现按需打包，为了避免出现打包文件过大可以打包成多个文件。 2、 编译typescript、ES6等高级js语法
随着前端技术的强大，开发中可以使用javascript的很多高级版本，比如:typescript、ES6等，方便开发， webpack可以将打包文件转换成浏览器可识别的js语法。
3、CSS预编译
webpack允许在开发中使用Sass 和 Less等原生CSS的扩展技术，通过sass-loader、less-loader将Sass 和 Less的
语法编译成浏览器可识别的css语法。
webpack的缺点:
1、配置有些繁琐 2、文档不丰富
Node.js
webpack基于node.js运行，首先需要安装node.js。
Node.js就是一个javascript的运行环境，可以类比为jdk，它的作用就是让javascript可以咋服务器端运行
安装node.js以及相关组件
1.nodejs官网下载node的包，一路下一步
2.有些同学使用mac，想要修改包以及缓存的下载路径，再次声明，不建议修改，如果修改了会报错，此时需要删除用户文件夹下面的.npmrc(此文件是修改配置后的缓存文件)
3.查看是否安装成功
node -v
npm -v
4.此时默认是国外镜像，如果要切换镜像，在命令行粘贴一下命令，切换为国内的淘宝镜像
npm install -g cnpm --registry=https://registry.npm.taobao.org
5.查看是否成功
cnpm -v
6.安装nrm程序
cnpm install -g nrm
7.查看目前所使用的镜像
nrm ls
可以看到此时使用的是npm镜像
8.切换镜像
nrm use taobao
此时镜像已经切换成淘宝的镜像
9.安装webpack
本地安装:仅将webpack安装在当前项目的node_modules目录中，仅对当前项目有效。
全局安装:将webpack安装在本机，对所有项目有效，全局安装会锁定一个webpack版本，该版本可能不适用某个 项目。全局安装需要添加 -g 参数。
进入webpacktest测试目录目录，运行: 1)本地安装:
只在我的项目中使用webpack，需要进行本地安装，因为项目和项目所用的webpack的版本不一样。本地安装就会 将webpack的js包下载到项目下的npm_modeuls目录下。
在门户目录下创建webpack测试目录webpacktest01:
npm install --save-dev webpack 或 cnpm install --save-dev webpack npm install --save-dev webpack-cli (4.0以后的版本需要安装webpack-cli) 2)全局安装加-g，如下: 全局安装就将webpack的js包下载到npm的包路径下。
npm install webpack -g 或 cnpm install webpack -g
3)安装webpack指定的版本:
本教程使用webpack3.6.0，安装webpack3.6.0:
进入webpacktest测试目录，运行:cnpm install --save-dev [email protected]
全局安装:npm install [email protected] -g或 cnpm install [email protected] -g