npm run build后将打包文件夹生成zip压缩包

  1. 安装依赖
bash 复制代码
npm install archiver --save-dev
  1. 准备compress.js文件
javascript 复制代码
const fs = require('fs');
const archiver = require('archiver');

const sourceDir = './dist';  //替换为你的文件夹路径
const outputZip = './dist.zip';

console.log(`开始压缩`);
const output = fs.createWriteStream(outputZip);
const archive = archiver('zip', { zlib: { level: 9 } });

output.on('close', () => {
  console.log(`压缩完成: ${archive.pointer()} 字节`);
});

archive.pipe(output);
archive.directory(sourceDir, true);//true则保留顶级目录,false则不保留
archive.finalize();
  1. 在package.json中调用compress.js

在build命令后面,添加并执行一个postbuild命令。

javascript 复制代码
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "postbuild": "node compress.js"
  },

于是,当运行npm run build后,会先生成打包文件夹,再基于该文件夹生成zip压缩包。

相关推荐
Linux-lucky13 分钟前
45-Linux学习之旅之防火墙与WEB加固
linux·前端·网络·学习·ubuntu
风骏时光牛马2 小时前
生成一个移动端标题,只需要一个标题,不需要其他的任何文本。
前端
IT_陈寒3 小时前
Redis雪崩把我坑惨了,这是5年经验的教训
前端·人工智能·后端
SameX3 小时前
HarmonyOS ArkUI List 的侧滑删除 用 ListItem 的 swipeAction + endIcon 的做法
前端
usdoc文档预览5 小时前
USDOC系列之PPT文件在线编辑-VUE前端实现在线浏览器在线编辑PPT文档
前端·vue.js·编辑器·office365·ppt在线编辑·office文件在线编辑·文件在线编辑
用户2705077725245 小时前
Agent 调工具卡住?3 种超时与取消策略实测对比
前端
LuHang6 小时前
我一行代码没写,把领导派的活做成了公司内部系统😭
前端
明月_清风6 小时前
Meta 开源了一个 AI Native 组件库:Astryx,150+ React 组件,专为 AI Agent 而设计
前端·人工智能·ai编程
用户087308654877 小时前
用 GUI 自动化写了一个群聊 AI:5 个真实事故,和 7 条让 AI 不像机器人的设计
node.js
用户850869276157 小时前
秒杀系统中 Shell 脚本并发控制 Bug:究竟哪里出了
前端