VUE项目打包压缩(compression-webpack-plugin)
时间:2021-08-20
本文章向大家介绍VUE项目打包压缩(compression-webpack-plugin),主要包括VUE项目打包压缩(compression-webpack-plugin)使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
环境
win10 x64 npm 6.14.13 node 14.17.3 vue 2.6.11
安装插件
cnpm install compression-webpack-plugin@1.1.12 -S
根目录新建配置文件 vue.config.js
const CompressionWebpackPlugin = require('compression-webpack-plugin') module.exports = { configureWebpack: { plugins: [ new CompressionWebpackPlugin({ filename: '[path].gz[query]', algorithm: 'gzip', test: new RegExp('\\.(js|css)$'), threshold: 10240, minRatio: 0.8 }) ] } }
Nginx配置(客户端支持的话,直接开启也可以压缩)
gzip on; # 开启Gzip gzip_static on; # 开启静态文件压缩 gzip_min_length 1k; # 不压缩临界值,大于1K的才压缩 gzip_buffers 4 16k; gzip_http_version 1.1; gzip_comp_level 2; gzip_types text/plain application/javascript application/x-javascript text/javascript text/css application/xml application/xml+rss; # 进行压缩的文件类型 gzip_vary on; gzip_proxied expired no-cache no-store private auth; gzip_disable "MSIE [1-6]\.";
打包成功
压缩前
压缩后
原文地址:https://www.cnblogs.com/xuanjiange/p/15165936.html
- 【插件开发】—— 4 SWT编程须知
- 【插件开发】—— 5 SWT控件以及布局使用
- 【插件开发】—— 6 SWT 复杂控件使用以及布局
- 【插件开发】—— 7 SWT布局详解,不能再详细了!
- 【插件开发】—— 8 IPreferenceStore,插件的键/值存储!
- 【插件开发】—— 9 编辑器代码分块着色-高亮显示!
- 【插件开发】—— 10 JFace开发详解
- 【插件开发】—— 12 GEF入门
- 【插件开发】—— 13 GEF双击模型事件
- 给博客添加节日雪花
- 修改Cisco交换机密码
- MySQL服务无法正常启动的解决方法(1053错误)
- 获取局域网内所有用户和IP
- CLR和.Net对象生存周期
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法