是什么
Webpack 是一个用于现代 JavaScript 应用程序的静态模块打包工具
为什么使用
Webpack是前端工程化主要使用的工具，一些前端框架脚手架工具都内置了Webpack。它可以
- 进行代码分析和压缩，减少代码体积
- 对源代码进行转译，使其兼容旧版本浏览器等
如何使用
安装：
在项目文件夹中
npm init -y \\初始化
npm install webpack webpack-cli --save--dev
使用@可指定版本：webpack@4
--save--dev 保存配置信息到package.json的devDependencies节点中
devDependencies：开发时的依赖。里面的模块是开发时用的，发布时用不到它。
webpack-cli 用于在命令行中运行webpack
使用：
创建源代码文件（./src）
源代码是指用于书写和编辑的代码
运行Webpack，将源文件进行打包
./node_modules/.bin/webpack --version //访问本地的webpack的第一种方法（手动找路径）
npx webpack //访问本地的webpack的第二种方法（自动寻找路径，但如果node安装路径中有空格就无法使用）
默认配置的入口文件是./src/index.js，入口文件是Webpack进行打包的入口
打包过程
Webpack会根据入口文件，以及其声明所需要的依赖（例如import的文件），构建出依赖图，然后使用依赖图生成优化（代码分析、压缩以及对旧版本浏览器的兼容等）过后的集成代码，存放到分发代码文件夹（./dist）。
打包的时候，会在根文件夹创建分发代码文件夹（./dist）用于存放分发代码。
分发代码是指在构建过程中，经过最小化和优化后产生的输出结果，最终将在浏览器中加载，也就是打包的结果。
问题
Webpack只能识别JS文件和JSON文件，这些功能对于开发来说是远远不够的，如何使其能够
- 识别其他类型的文件（.css\.ts...）并进行合适地转译
- 自动生成HTML文件、引入JS文件
- 还有如何自己配置打包入口和输出
- 。。。。。。
这些问题将会用到Webpack的配置文件、plugin和loader来解决，带着这些问题继续学习Webpack吧~
