npm run build 自动生成dist.zip

需求场景:每次项目打包都需要手动将dist文件夹,压缩为dist.zip 比较繁琐

功能实现:每次运行npm run build 自动生成 dist.zip

首先下载插件

bash 复制代码
npm install filemanager-webpack-plugin --save-dev

然后在项目根目录找到:vue.config.js 文件

bash 复制代码
const { defineConfig } = require('@vue/cli-service')
// 插件地址: https://www.npmjs.com/package/filemanager-webpack-plugin
const FileManagerPlugin = require('filemanager-webpack-plugin')
const path = require('path')

module.exports = defineConfig({
  lintOnSave: false,
  transpileDependencies: true,
  // 配置插件
  configureWebpack: {
    plugins: [
      new FileManagerPlugin({
        events: {
          onEnd: {
            delete: ['./dist.zip'],
            archive: [{
              source: path.join(__dirname, './dist'),
              destination: path.join(__dirname, './dist.zip')
            }]
          }
        }
      })
    ]
  }
})

最后在终端运行:npm run build ,运行结束在项目根目录自动生成 dist.zip 压缩包

相关推荐
百万蹄蹄向前冲1 小时前
风扇转了一晚上MVP专家团翻车事故
前端·人工智能
默_笙1 小时前
🏛 给 AI 配一间办公室:Harness Engineering 六大模块与它的实现
前端·javascript
linux_cfan3 小时前
videojs v10 源代码系列解读:14 · 谓词守卫:在运行时安全地调用能力
前端·javascript·音视频
kyriewen3 小时前
我扒了 10,221 条 JD:腾讯技术岗 75% 在要 AI
前端·人工智能·ai编程
郑州光合科技余经理4 小时前
同城外卖小程序开发:下单成功后,后台导出能不能对上用户端状态
开发语言·前端·git·后端·uni-app·php·ai编程
IT_陈寒4 小时前
Vue的响应式让我熬到凌晨三点,原来漏了这个小细节
前端·人工智能·后端
Blanche15005 小时前
利用 RAG 为答疑机器人扩展知识范围
前端
天若有情6735 小时前
【纯前端小工具】公历生日转农历,批量查询每年农历生日对应的公历日期(GitHub Pages在线直接用)
前端·javascript·github pages·农历转换·lunisolar·网页小工具
SoonITer5 小时前
怎样构建一个 Agent-friendly 的网站
前端·agent
颜进强5 小时前
01 · NestJS 是什么:用途、解决什么问题、与热门框架对比
前端·后端·ai编程