本篇文章主要介绍了浅谈如何使用 webpack 优化资源，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧

从 webpack book 的 Loading Assets 一章中延申出来。 改善前端项目体验中，很重要的点就是静态资源的优化。它是由于浏览器客户端在同一时间针对同一 域名 的请求有一定资源限制。如果资源过多、过大就会使得页面卡顿。 静态资源中，又以图片最为典型。那么我们在开发中该如何处理图片呢？ webpack 是前端较为常用的手脚架工具，本文以它为例。 主要分为 开发 、 打包 、 优化 三个方面来介绍 示例地址: webpack demo 开发 webpack 可以用使用url-l

前言 在前端应用的优化中，对加载资源的大小控制极其的重要，大多数时候我们能做的是在打包编译的过程对资源进行大小控制、拆分与复用。 本片文章中主要是基于 webpack 打包，以 React、vue 等生态开发的单页面应用来举例说明如何从 webpack 打包的层面去处理资源以及缓存，其中主要我们需要做的是对 webpack 进行配置的优化，同时涉及少量的业务代码的更改。 同时对打包资源的分析可以使用 (webpack-contrib/webpack-bundle-analyzer) 插件，当然可