• 处理样式资源

• 处理图片资源

• 修改输出资源的名称和路径

• 自动清空上次打包资源

• 处理其他资源（如音视频）

• 处理 js 资源

原因是 Webpack 对 js 处理是有限的，只能编译 js 中 ES 模块化语法，不能编译其他语法，导致 js 不能在 IE 等浏览器运行，所以我们希望做一些兼容性处理

其次开发中，团队对代码格式是有严格要求的，我们不能由肉眼去检测代码格式，需要使用专业的工具来检测

Eslint：检测代码格式无误后

Babel：

主要用于将 ES6 语法编写的代码转换为向后兼容的 JavaScript 语法，以便能够运行在当前和旧版本的浏览器或其他环境中

• 处理 Html 资源

dist 目录就会输出一个 index.html 文件，并且会自动引入打包好的js文件

• 开发服务器&自动化

• 提取 Css 成单独文件

Css 文件目前被打包到 js 文件中，当 js 文件加载时，会创建一个 style 标签来生成样式， 这样对于网站来说，会出现闪屏现象，用户体验不好， 我们应该是单独的 Css 文件，通过 link 标签加载性能才好

• css兼容性

• css代码压缩