vue3基于vite打包

大的js和css打包成:gzip

复制代码
npm install vite-plugin-compression

在vite.config.ts中配置:

复制代码
import viteCompression from 'vite-plugin-compression'


plugins:[
    viteCompression({
        verbose:true,//控制台输出压缩结果
        disable:false,//开启还是禁用
        threshold:1024,//体积大于threshold的设置压缩
        algorithm:'gzip',//压缩算法
        ext:'gz',//文件后缀名
    })
]

压缩完之后,告诉后端去配置gz文件。

gzip压缩目的是为了缩小代码体积,让资源加载更快,使用了一个插件,vite-plugin-compression,配置好之后,打包出来的就是压缩后的代码,把dist文件给后端进行部署。

相关推荐
骇客野人1 小时前
Java 前后端可部署落地架构方案
服务器·前端·微服务
OpenTiny社区1 小时前
从开发到运行:OpenTiny NEXT 如何构建 Agent 时代的 Web 应用
前端·开源·ai编程·opentiny
feixing_fx1 小时前
伪类与伪元素的魔法:纯 CSS 打造炫酷的按钮悬停特效
前端·css·css3
动恰客流统计1 小时前
用客流数据优化门店排班:高峰不缺人、平峰不浪费的落地路径
大数据·前端·人工智能
广州山泉婚姻1 小时前
前后端分离的核心优势
前端·后端
志尊宝1 小时前
Vue3 零基础每日笔记(043):defineModel 与 defineExpose 的 TS 用法——3.4+ 新 API 进阶
前端·javascript·vue·html·vue3
洛兮银儿1 小时前
前端页面引入cesium
前端·cesium
SEO_juper1 小时前
2026年用Python分析网站访问日志:看清Googlebot和AI爬虫怎么爬你的站(附完整代码)
开发语言·前端·seo·独立站·谷歌优化
传奇开心果编程1 小时前
【ArkUI 练中学】第1课:从零开始
学习·华为·前端框架
摸鱼仙人~1 小时前
React 原理进阶:彻底理解 re-render、React.memo、useMemo 与 useCallback
前端·vue.js