用vue2.0开发项目,使用npm run build 命令 ,但是只会生成dist文件夹,以下是生成zip压缩包方法

1,插件安装

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

安装:      npm install filemanager-webpack-plugin --save-dev  或 npm install filemanager-webpack-plugin --save-dev

2.webpack配置

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

const FileManagerPlugin = require('filema nager-webpack-plugin')

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

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

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

3.执行效果 
配置完成后,重新执行 npm run build 命令 执行完后 ,在dist文件夹内(上面配置的目的地目录为 dist文件夹)就可以看到

												

vue -- vue-cli webpack项目打包后自动压缩成zip文件的更多相关文章

  1. vue-webpack项目自动打包压缩成zip文件批处理

    为什么需要这个? 使用vue框架开发项目,npm run build这个命令会一直用到,如果需要给后端发包,那你还要打包成zip格式的压缩包,特别是项目提测的时候,一天可能要执行重复好几次,所以才有了 ...

  2. vue+webpack项目打包后背景图片加载不出来问题解决

    在做VUE +的WebPack脚手架项目打包完成后,在IIS服务器上运行发现项目中的背景图片加载不出来检查项目代码发现是因为CSS文件中,背景图片引用的路径问题;后来通过修改配置文件,问题终于解决了, ...

  3. Vue -- webpack 项目自动打包压缩成zip文件

    这段时间用 Vue2.0 开发项目,每次打包都会用到 npm run build 命令,但是每次部署时给后端发包都要手动zip压缩,这样一两次还行,但遇到项目板块测试和临时加急功能测试的时候,一天可能 ...

  4. vue.js - 解决vue-cli打包后自动压缩代码

    一.webpack中引入的压缩代码 /build/webpack.prod.conf.js const OptimizeCSSPlugin = require('optimize-css-assets ...

  5. .net 生成html文件后压缩成zip文件并下载

    这里只做一个简单的实例 public ActionResult Index() { string path = Server.MapPath("/test/");//文件输出目录 ...

  6. vue项目打包后想发布在apache www/vue 目录下

    使用的是vue-element-admin做示例,可以参考Vue项目根据不同运行环境打包项目,其他项目应该大同小异. 使用vue-router的browserHistory模式,配置mode: 'hi ...

  7. vue项目打包后资源相对引用路径的和背景图片路径问题

    vue项目中若要使用相对路径来获得相应静态资源,需要修改以下内容来确保项目打包后能正常运行. 1.修改config => index.js => build => assetsPub ...

  8. vue项目打包后运行报错400如何解决

    昨天一个Vue项目打包后,今天测试,发现无论localhost还是服务器上都运行不了,报错如下: Failed to load resource: the server responded with ...

  9. Vue.js中用webpack合并打包多个组件并实现按需加载

    对于现在前端插件的频繁更新,所以多多少少要对组件化有点了解,下面这篇文章主要给大家介绍了在Vue.js中用webpack合并打包多个组件并实现按需加载的相关资料,需要的朋友可以参考下.   前言 随着 ...

随机推荐

  1. 动图+源码,演示Java中常用数据结构执行过程及原理

    最近在整理数据结构方面的知识, 系统化看了下Java中常用数据结构, 突发奇想用动画来绘制数据流转过程. 主要基于jdk8, 可能会有些特性与jdk7之前不相同, 例如LinkedList Linke ...

  2. Math和Date

    Math和Date 一.对象 1.对象的概念 对象的本质:键值对,属性名和属性值 对象的意义:存储数据,编程 对象中的变量:属性 对象中的函数:方法 2.对象的赋值 var obj = {}; var ...

  3. .net必问的面试题系列之面向对象

    上个月离职了,这几天整理了一些常见的面试题,整理成一个系列给大家分享一下,机会是给有准备的人,面试造火箭,工作拧螺丝,不慌,共勉. 1.net必问的面试题系列之基本概念和语法 2.net必问的面试题系 ...

  4. 如何编写高质量的 JS 函数(1) -- 敲山震虎篇

    本文首发于 vivo互联网技术 微信公众号 链接:https://mp.weixin.qq.com/s/7lCK9cHmunvYlbm7Xi7JxQ作者:杨昆 一千个读者,有一千个哈姆雷特. 此系列文 ...

  5. 微擎 人人商城 对接京东vop 对接京东商品,同步商品 地址,库存,价格,上下架等。(二) 设置后台管理界面

    昨天提到了,由于vop商品池未开通,故对接工作只能暂缓,现在要做一个专门针对vop商品的后台管理, 老规矩,先上设计链路图 因为后台本来就是有比较完善的商品管理系统, 所以我们只是针对vop 进行简单 ...

  6. library not found for -ljpush-ios-3.2.1错误

    很多人在更新pod后报 library not found for -ljpush-ios-3.2.1(举例)错误,这其实是包含版本号类型错误. 究其原因:使用了版本号做库名字,pod升级后 Podf ...

  7. Codeforces Round #480 (Div. 2) B. Marlin

    题目地址:http://codeforces.com/contest/980/problem/B 官方题解: 题意: 有一个城市有4行n列,n是奇数,有一个村庄在(1,1),村民在(4,n)钓鱼:还有 ...

  8. poj 2406 Power Strings(kmp next的应用)

    题目链接:http://poj.org/problem?id=2406 题意:就是求一个字符串最多有几个相同的小字符串组成. 题解:直接求一下next然后找到长度,长度就是len-1-next[len ...

  9. hotcss.js Flexible 移动端适配在dpr=2和dpr=3出现的字体大小设置不正确问题.

    这段时间一直在用hotcss做移动端适配,做了几个页面没有发现什么问题,后来老大要加快进度,我把项目分出一块给另一个同事做,她发现了一个问题就是字体在dpr=2,dpr=3,的设备上字体大小显示老是不 ...

  10. 实现 Java 本地缓存,该从这几点开始

    缓存,我相信大家对它一定不陌生,在项目中,缓存肯定是必不可少的.市面上有非常多的缓存工具,比如 Redis.Guava Cache 或者 EHcache.对于这些工具,我想大家肯定都非常熟悉,所以今天 ...