热门标签 | HotTags
当前位置:  开发笔记 > 前端 > 正文

Vue  webpack项目自动打包压缩成zip文件的方法

这篇文章主要介绍了Vue--webpack项目自动打包压缩成zip文件的方法,本文给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下

这段时间用 Vue2.0 开发项目,每次打包都会用到 npm run build 命令,但是每次部署时给后端发包都要手动zip压缩,这样一两次还行,但遇到项目板块测试和临时加急功能测试的时候,一天可能就要打包好多次,这就很烦了。所以索性在执行 npm run build 命令时就直接打包成zip文件,方便省事!

1、插件装备

  webpack插件:filemanager-webpack-plugin,该插件可执行打包,复制,移动,删除文件以及新文件夹在build之前及之后创建。

  安装:

npm install filemanager-webpack-plugin --save-dev
或
cnpm install filemanager-webpack-plugin --save-dev

2、webpack配置

  ① 在项目 根目录 build/webpack.base.config.js 中 抬头变量声明区域添加

const FileManagerPlugin = require('filemanager-webpack-plugin')

  ② 在根目录 build/webpack.base.config.js 内找到 module.exports。 然后在plugins内添加

new FileManagerPlugin({
 onEnd: {
  delete: [
   './dist/control-operate.zip',
  ],
  archive: [
   {source: './dist', destination: './dist/control-operate.zip'},
  ]
 }
})

  注:若 plugins不存在,则新建plugins,plugins为数组格式。

3、执行效果

  配置完成后,重新执行 npm run build 命令。执行完成后,在dist文件夹内(上面配置的目的地目录为 dist文件夹),就可以看到压缩好的zip文件包了。

4、其他功能

module.exports = {
 ......
 plugins: [
  new FileManagerPlugin({
   onEnd: {
    copy: [
     {source: '/path/from', destination: '/path/to'},
     {source: '/path/**/*.js', destination: '/path'},
     {source: '/path/fromfile.txt', destination: '/path/tofile.txt'},
     {source: '/path/**/*.{html,js}', destination: '/path/to'},
     {source: '/path/{file1,file2}.js', destination: '/path/to'},
     {source: '/path/file-[hash].js', destination: '/path/to'}
    ],
    move: [
     {source: '/path/from', destination: '/path/to'},
     {source: '/path/fromfile.txt', destination: '/path/tofile.txt'}
    ],
    delete: [
     '/path/to/file.txt',
     '/path/to/directory/'
    ],
    mkdir: [
     '/path/to/directory/',
     '/another/directory/'
    ],
    archive: [
     {source: '/path/from', destination: '/path/to.zip'},
     {source: '/path/**/*.js', destination: '/path/to.zip'},
     {source: '/path/fromfile.txt', destination: '/path/to.zip'},
     {source: '/path/fromfile.txt', destination: '/path/to.zip', format: 'tar'},
     {
      source: '/path/fromfile.txt',
      destination: '/path/to.tar.gz',
      format: 'tar',
      options: {
       gzip: true,
       gzipOptions: {
        level: 1
       }
      }
     }

    ]
   }
  })
 ],
 ......
}

总结

以上所述是小编给大家介绍的Vue  webpack 项目自动打包压缩成zip文件的方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!


推荐阅读
  • 1.安装cordovapluginaddcordova-plugin-file-transfercordovapluginaddcordova-plugin-fi ... [详细]
  • WebBrowser控件(1)
    WindowsPhone7内置了一个强大的网络浏览器,该浏览器的内核是基于桌面版的InternetExplorer7(Mango版基于InternetE ... [详细]
  • 各个组件confspark-env.sh配置spark的环境变量confspark-default.conf配置spark应用默认的配置项和spark-env.sh有重合之处,可在 ... [详细]
  • FF——————————–直接使用document.creatRange()来创建一个选区;默认是空的;使用selectNode(obj)来代替moveToElementText ... [详细]
  • idea启动springmvc项目时报找不到类的解决方法
    这篇文章主要介绍了idea启动springmvc项目时报找不到类的解决方法,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值, ... [详细]
  • 一个不错的JDBC连接池教程(带具体例子)
    1.前言数据库应用,在许多软件系统中经常用到,是开发中大型系统不可缺少的辅助。但如果对数据库资源没有很好地管理(如:没有及时回收数据库的游 ... [详细]
  • 正月十五后第一贴:网页设计素材倾情奉献(附下载源文件)
    昨晚通宵把本该年前完成的项目中,最后两模块搞完.浏览整个系统,可以用惨不忍睹来形容,功能上实现是没问题,不过,页面布局,美化等,就太差的忒多了.于是google之,找到的很少, ... [详细]
  • 重装WIN7之后使用UbuntuLiveCD修复grub2双系统引导拿起ubuntu启动光盘启动进入试用ubuntu,打开终端输入命令sudofdisk-l#查看我u ... [详细]
  • VS2010快捷键大全原文:http:www.cnblogs.comLifeKingcnarchive201304163023603.html【窗口快捷键】Ctrl+W,W:浏览器 ... [详细]
  • 计算机网络四
    大三上结束之际,从网上找来一些关于计算机网络的知识作为总结,本文四篇笔记全部转自猪头任(博客地址:http:www.cnbl ... [详细]
  • 本文由编程笔记#小编为大家整理,主要介绍了xxxisnotinthesudoersfile.Thisincidentwillbereported.的解决方法相关的知识,希望对你有一 ... [详细]
  • .net4.0
    转载于:https:www.cnblogs.comzanxiaofengarchive2010042017 ... [详细]
  • IE下PHPiframe跨域导致session丢失问题的解决方法|一个登录页面,被别的网站用iframe嵌进去后,死活无法登录(只在IE中存在这种情况)。主要是session无 ... [详细]
  • SQLPLUS 命令
    定制:sql提示符信息1、显示SQLPLUS帮助,命令如下:HELPINDEX@COPYPAUSESHUTDOWN@@DEFINEPRINTSPOOLDELPR ... [详细]
  • 如何去除Win7快捷方式的箭头
    本文介绍了如何去除Win7快捷方式的箭头的方法,通过生成一个透明的ico图标并将其命名为Empty.ico,将图标复制到windows目录下,并导入注册表,即可去除箭头。这样做可以改善默认快捷方式的外观,提升桌面整洁度。 ... [详细]
author-avatar
好咯午睡了_740
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有