首先添加yarn add 插件 “compression-webpack-plugin”

然后在vue.config.js里引入

在configureWebpack里增加插件代码。

注意：deleteOriginalAssets: true。网上很多博客都是false，然后打包体积比原来还多。尴尬！

结果，打包体积从5.85m。减到2.71m。给力！！！

vue-cli3开启gzip压缩的更多相关文章

  1. Vue CLI3 开启gzip压缩

    gizp压缩是一种http请求优化方式,通过减少文件体积来提高加载速度.html.js.css文件甚至json数据都可以用它压缩,可以减小60%以上的体积. webpack在打包时可以借助 compr ...

  2. Nginx 开启gzip 压缩

    随着nginx的发展,越来越多的网站使用nginx,因此nginx的优化变得越来越重要,今天我们来看看nginx的gzip压缩到底是怎么压缩的呢? gzip(GNU-ZIP)是一种压缩技术. 经过gz ...

  3. 【转载】HttpWebRequest开启gzip压缩简介

    在用HttpWebRequest对象时,一般我们都没有开启gzip压缩,如果服务端返回的数据比较大,这是我们需要开启gzip压缩,怎么开启呢? 1.给HttpWebRequest对象,添加如下Head ...

  4. IIS7.5开启GZip压缩

    在IIS7.5选择要开启GZip压缩的网站,在功能视图中找到并双击"压缩"图标,在压缩界面中钩选"启用静态内容压缩"和"启用动态内容压缩", ...

  5. 修改Apache配置文件开启gzip压缩传输

    转自:http://down.chinaz.com/server/201202/1645_1.htm 最近无事研究一些Web的优化,用工具page speed检测网站时发现还没有开启gzip压缩,于是 ...

  6. IIS6.0开启gzip压缩(来自百度)

    IIS6.0开启gzip压缩 | 更新:2012-08-10 10:29 1 2 3 4 5 分步阅读 开启gzip可以极大的加速网站.有时压缩比率高达80%,近来测试了一下,最少都有40%以上,还是 ...

  7. Nginx开启gzip压缩功能

    在Nginx安装完成之后,我们可以开启Gzip压缩功能,这里Nginx默认只能对text/html类型的文件进行压缩.下面的指令为开启Gzip的指令: gzip on; gzip_http_versi ...

  8. WIN2003服务器IIS下如何开启GZIP压缩

    在上一篇文章黑客流谈到了关于网页打开速度对SEO的影响,其中提到了网页开启Gzip压缩的好处,接下来我来和大家分享一下WINDOWS系统IIS服务器下如何开启Gzip压缩. 首先我们来了解一下什么是G ...

  9. apache 配置静态文件缓存和开启gzip压缩

    1,设置文件静态缓存3天: 在httpd.conf 里添加如下代码: #文件静态缓存配置 <IfModule expires_module> #打开缓存 ExpiresActive on ...

  10. Nginx 开启gzip压缩(图片,文件,css)

    1.Vim打开Nginx配置文件 vim /usr/local/nginx/conf/nginx.conf 2.找到如下一段,进行修改 gzip on; gzip_min_length 1k; gzi ...

随机推荐

  1. vertx的学习总结6之动态代理类和测试

    Beyond the event bus 一.章节覆盖: 如何在事件总线之上公开服务 verticles和事件总线服务的异步测试 动态代理: MyService 接口 package porxy.te ...

  2. vue-test -------style绑定

    <template> <p :style="{color:activeColor,fontSize:fontsize+'px'}"></p> & ...

  3. 使用vLLM和ChatGLM3-6b批量推理

    当数据量大的时候,比如百万级别,使用 ChatGLM3-6b 推理的速度是很慢的.发现使用 vLLM 和 ChatGLM3-6b 批量推理极大的提高了推理效率.本文主要通过一个简单的例子进行实践. 1 ...

  4. 华企盾DSC可能涉及的Linux命令

    掌握Linux系统的基本命令 详细使用请参考:Linux命令大全 uname 查看系统信息 wget 文件下载 chmod 改变文件或目录权限 ls 显示指定工作目录下的内容及属性信息 cd 切换当前 ...

  5. Python 中 key 参数的含义及用法

    哈喽大家好,我是咸鱼 我们在使用 sorted() 或 map() 函数的时候,都会看到里面有一个 key 参数 其实这个 key 参数也存在于其他内置函数中(例如 min().max() 等),那么 ...

  6. MD5加密算法工具类创建

    直接上代码 /** * 通用方法工具类 */ public class CrowdUtil { /** * 对明文字符串进行MD5加密 * @param source * @return */ pub ...

  7. cache操作：clean、invalidate与flush的含义

    前言 本文试图搞清楚cache几个操作:clean.invalidate与flush的含义.由于只用过ARM和RISC-V,所以是从ARM和RISC-V的角度来说明. cache line cache ...

  8. Python——第二章：字符串操作——索引和切片

    索引: 按照位置提取元素 可以采用索引的方式来提取某一个字符(文字) s = "我叫周杰伦" print(s[3]) #程序员都是从0开始数,这里的3代表第4位,也就是" ...

  9. 善用 vscode 的批量和模板技巧来提效

    vs code 其实有很多实用的技巧可以在日常工作中带来很大的提效,但可能是开发中没有相应的痛点场景,因此有些技巧接触的人不多 本篇就来介绍下多光标的批量操作和模板代码两种技巧在日常工作中的提效 涉及 ...

  10. 计算机网络分层结构--OSI模型、TCP/IP 模型、五层模型

    计算机网络分层结构 OSI参考模型与TCP/IP参考模型 五层参考模型