在网页中会引用到哪些常见的静态资源？
- js (.js .jsx .coffee .ts)
- css (.css .less .sass .scss scss是sass的plus版)
- images(.jpg .png .gif .bmp .svg)
- videos
- audios
- fonts(.svg .ttf .eot .woff .woff2)
- templates(.ejs .jade .vue)
网页中引入的静态资源多了以后会有什么问题？
- 网页加载速度慢，因为我们要发起很多的二次请求
- 要处理错综复杂的依赖关系
如何解决上诉两个问题？
- 合并、压缩、精灵图(雪碧图：css sprites)、图片的base64编码
- 可以使用requireJS、也可以使用webpack可以解决各个包之间的复杂依赖关系
什么是webpack?
webpack是前端静态资源打包工具，它通过递归查找的方式查找各个模块之间的依赖关系，并且打包成一个或多个bundle(它是基于Node.js开发出来的一个前端工具)
如何完美实现上述的2种解决方案?
- 使用Gulp，是基于task任务的
- 使用webpack，是基于整个项目进行构建的
