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 压缩包

相关推荐
老虎062712 分钟前
JavaWeb前端02(JavaScript)
开发语言·前端·javascript
耀耀切克闹灬12 分钟前
WEB前端基础知识梳理(四)
前端
anyup23 分钟前
🔥🔥 10 天 Star 破百!uView Pro 文档也开源啦:完全免费、无广告、高效上手
前端·vue.js·uni-app
puppy0_028 分钟前
Webpack 打包流程及 Hooks 汇总
前端·webpack·前端工程化
Rasir28 分钟前
第七章:高级特性与项目优化
前端
春日野柚28 分钟前
前端打包优化分析
前端·webpack
yvvvy32 分钟前
DNS 解析全解析:从域名到 IP 的“桥梁”之旅
前端
柯南二号38 分钟前
【后端】SpringBoot中HttpServletRequest参数为啥不需要前端透传
前端·spring boot·后端
Dignity_呱1 小时前
如何在不发版时,实现小程序的 AB 测试?
前端·面试·微信小程序
Clownseven1 小时前
Docker+Nginx+Node.js实战教程:从零搭建高可用的前后端分离项目
nginx·docker·node.js