![](https://img-blog.csdnimg.cn/20201014180756926.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
WebPack
文章平均质量分 77
不见浅诗~
向上攀爬的这条路比站在顶峰更让人热血澎湃
展开
-
Webpack常用的压缩,CSS,JS,图片
本篇文章参考以下博文webpack常用的三种JS压缩插件webpack怎样压缩css?webpack5单独提取css文件,兼容处理及压缩(四)webpack提取图片文件打包压缩文章目录前言JavaScript压缩terser-webpack-pluginCSS 压缩Optimize css Assets webpack Plugin图片压缩image webpack loader前言 针对现在常用的 webpack 压缩方法进行一下总结,方便自己后续使用和查看。JavaScript压原创 2021-03-21 17:04:51 · 474 阅读 · 0 评论 -
前端性能如何优化?
本篇文章参考以下博文前端性能优化 24 条建议(2020)React技术揭秘文章目录前言一、减少延迟感知二、提高页面加载速度2.1 减少 HTTP 请求2. 使用 HTTP2前言 最近在学习过程中突然看到这个问题,也想总结以下自己关于性能优化的理解,这个问题比较大,我们需要逐步解耦来处理,回答需要有条理,有逻辑,才不至于涵盖面不全,有遗漏点。 首选我们要弄清楚一个问题,为什么要性能优化?或者说性能优化的目的是什么?那肯定是为了快速响应客户的操作。那么怎么样才能实现快速响应呢?可以从两方面原创 2021-03-11 17:26:35 · 346 阅读 · 0 评论 -
WebPack打包性能优化
本篇文章参考以下博文WebPack实战教程文章目录前言开发环境性能优化HMR(必用)source-map生产环境性能优化优化打包构建速度oneOf缓存多进程打包externalsdll优化代码运行性能缓存(第二次访问速度更块)tree shakingcode split懒加载 / 预加载PWA前言 平时做项目的时候,最开始是在本地进行调试,调试完成后部署到服务器上,偶尔会出现与本地调试有出入的地方,导致需要重新打包,重新部署,相当耗费时间。 为解决这一问题,可以使用 webpack原创 2021-03-01 14:13:27 · 278 阅读 · 0 评论 -
Webpack-生产环境基本配置
本篇文章参考以下博文WebPack实战教程文章目录前言生产环境基本配置前言 最近在做一些简单项目的打包,每个小项目的依赖库有细微差异,但是主要的配置信息都相似,css兼容,js兼容,html插件等,不同的是相关插件的使用情况。 本篇文章就初始化一个生产环境的基本配置,方便以后用来直接使用。生产环境基本配置 基本配置如下:首先配置了入口和出口;然后做css的配置,其中包括兼容和压缩;less文件配置js语法检查js兼容图片检测html中的图片其他文件最后插件的部分对原创 2021-02-17 23:24:34 · 230 阅读 · 0 评论 -
Webpack-JS兼容处理的三种方式
本篇文章参考以下博文WebPack实战教程文章目录前言JS兼容处理的三种方式babel-loader@babel/polyfillcore-js前言 最近在打包项目的时候,文件是打出来了,但是打出来的文件体积太大,主要是没几行的代码居然打出来了几百 KB ,这就有点离谱了。 查看了一下打包出来的文件,发现了一堆没用的 ES6 兼容内容,代码里根本没有使用,居然一股脑的全部打包进去了。 重新检索了一遍打包配置,发现是其中一项对于 js 的兼容处理有问题。记录一下,提原创 2021-02-16 21:26:35 · 498 阅读 · 0 评论 -
CSS中 :global,偷师学艺来的新技能 CSS Modules
本篇文章参考以下博文CSS Modules 用法教程文章目录原创 2020-05-21 20:18:41 · 3193 阅读 · 0 评论