一．什么是webpack
Webpack是一个静态的模块化打包工具，为现代的JS应用程序。
- 静态的：最终将所需的代码打包部署到静态服务器；
- 模块化：webpack默认支持各种模块化开发，AMD，CommonJS等；
- 现代的：webpack的出现和发展正是由于现代前端开发所面临的各式各样的问题。
- 打包：从官方给出的图中我们也可以看出webpack可打包的类型多样化，进而减少了页面请求。
二．Webpack安装
Webpack使用前提：
1.官方中文文档：https://webpack.docschina.org/
2.webpack的运行依赖于Node环境，在安装webpack前必须确保Node与npm正常使用。（Node官方网站：https://nodejs.org/）
Webpack的安装目前分为两个：webpack、webpack-cli。
两者间的关系：
执行webpack命令，会执行node_modules下的.bin目录下的webpack；
Webpack在执行时是依赖webpack_cli的，没有安装会报错；
在webpack_cli中执行代码时才是真正利用webpack进行编译和打包的过程。
Webpack安装方式：
1.全局安装（任一位置）
npm install webpack webpack_cli -g
2.局部安装（所需打包的文件夹下）
npm install webpack webpack_cli -D
注意：在实战中，多个不同项目打包，所需的webpack版本可能不同，使用全局安装会出错，很少使用，一般会在所用项目中单独局部安装。
三．默认打包
我们可以通过webpack进行打包，之后运行打包后的代码。
webpack
当我们在运行webpack时，它会查找当前目录下的src/index.js作为入口，如果我们想要自己来配置指定的入口和出口，可以进行以下操作：
npx webpack --entry ./src/main.js --output-path ./build
其中，./src/main.js是你想配置的入口，./bulid下的文件是你想配置的出口。
五．创建局部的webpack
- 创建package.json文件，用于管理项目的信息、库依赖等
npm init
- 安装局部webpack
npm install webpack webpack-cli -D
- 使用局部的webpack
npx webpack
- 在package.json中创建scripts脚本，执行脚本打包即可
“scripts”:{
“build”: “webpack”
}
npm run build
