What is Webpack？
要回答什么是webapck这个问题，首先我们要回答webpack它的作用，它在前端工作中主要解决什么问题。ok，在回答这些问题之前我们先回忆什么是前端项目，前端项目主要有什么构成。如下图所示，前端项目由各种资源文件组成其中包括逻辑文件、样式文件、静态资源等，各种资源文件的编写方法也很丰富。
随着前端项目变得庞大，相应的各种资源文件的数量和体量也会变大，那么如果仅仅是靠手动的去管理这些资源文件那也太费劲了（纯纯搬砖），严重影响开发效率。所以这个时候Webpack应运而生，Webpack本质上就是一个前端资源的编译和打包工具。编译是指将非标准的JS文件（比如说TS，样式文件……）编译成JS兼容的文件内容，而打包是指把编译好的内容打包成一个bundle。
How to use Webpack?
基本使用流程
1、安装webpack，webpack-cli
2、编辑webpack配置文件（配置文件有很多配置项，这里仅展示最简单的只有入口和出口）
3、执行编译命令（此时会将资源编译到产物中，如上文中main.js）
以上三步就是我们webpack的基本使用流程，即安装依赖、编写配置文件、执行编译命令。根据具体任务的不同，所需的依赖，和配置项也不一样。下面我们介绍一下webpack常见的几个应用场景。
使用webpack处理CSS
在这一部分开始之前，我们需要明确一点“Webpack只认识JS”。所以如果要处理非JS的内容，我们需要将非JS的内容首先翻译成JS，而这种资源翻译模块的角色就是由我们的Loader担任。要使用loader,那么首先需要安装相应的loader，然后再配置module属性。
参考文档
1[Webpack官方文档](Getting Started | webpack)
