vue -- vue-cli webpack项目打包后自动压缩成zip文件
用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文件的更多相关文章
- vue-webpack项目自动打包压缩成zip文件批处理
为什么需要这个? 使用vue框架开发项目,npm run build这个命令会一直用到,如果需要给后端发包,那你还要打包成zip格式的压缩包,特别是项目提测的时候,一天可能要执行重复好几次,所以才有了 ...
- vue+webpack项目打包后背景图片加载不出来问题解决
在做VUE +的WebPack脚手架项目打包完成后,在IIS服务器上运行发现项目中的背景图片加载不出来检查项目代码发现是因为CSS文件中,背景图片引用的路径问题;后来通过修改配置文件,问题终于解决了, ...
- Vue -- webpack 项目自动打包压缩成zip文件
这段时间用 Vue2.0 开发项目,每次打包都会用到 npm run build 命令,但是每次部署时给后端发包都要手动zip压缩,这样一两次还行,但遇到项目板块测试和临时加急功能测试的时候,一天可能 ...
- vue.js - 解决vue-cli打包后自动压缩代码
一.webpack中引入的压缩代码 /build/webpack.prod.conf.js const OptimizeCSSPlugin = require('optimize-css-assets ...
- .net 生成html文件后压缩成zip文件并下载
这里只做一个简单的实例 public ActionResult Index() { string path = Server.MapPath("/test/");//文件输出目录 ...
- vue项目打包后想发布在apache www/vue 目录下
使用的是vue-element-admin做示例,可以参考Vue项目根据不同运行环境打包项目,其他项目应该大同小异. 使用vue-router的browserHistory模式,配置mode: 'hi ...
- vue项目打包后资源相对引用路径的和背景图片路径问题
vue项目中若要使用相对路径来获得相应静态资源,需要修改以下内容来确保项目打包后能正常运行. 1.修改config => index.js => build => assetsPub ...
- vue项目打包后运行报错400如何解决
昨天一个Vue项目打包后,今天测试,发现无论localhost还是服务器上都运行不了,报错如下: Failed to load resource: the server responded with ...
- Vue.js中用webpack合并打包多个组件并实现按需加载
对于现在前端插件的频繁更新,所以多多少少要对组件化有点了解,下面这篇文章主要给大家介绍了在Vue.js中用webpack合并打包多个组件并实现按需加载的相关资料,需要的朋友可以参考下. 前言 随着 ...
随机推荐
- html页面中关于按钮type的要求
重要事项:如果在 HTML 表单中使用 button 元素,不同的浏览器会提交不同的值.Internet Explorer 将提交 <button> 与 </button> 之 ...
- 纯数据结构Java实现(4/11)(BST)
个人感觉,BST(二叉查找树)应该是众多常见树的爸爸,而不是弟弟,尽管相比较而言,它比较简单. 二叉树基础 理论定义,代码定义,满,完全等定义 不同于线性结构,树结构用于存储的话,通常操作效率更高.就 ...
- HBase 系列(四)—— HBase 集群环境配置
一.集群规划 这里搭建一个 3 节点的 HBase 集群,其中三台主机上均为 Regin Server.同时为了保证高可用,除了在 hadoop001 上部署主 Master 服务外,还在 hadoo ...
- h5中div边距去除
style样式里面加上 <style> *{ margin:0 ;//外边距为0 padding:0;//内边距为0 } </style>
- 【实践总结】给Centos和Ubuntu设置静态网络IP以及配置ssh功能
作为一名以Windows平台为主的开发者,在接触和使用Linux系统的过程中总会遇到一系列的问题.每当这时候,我相信大部分人是和我一样的处理办法,就是网上各种搜索尝试直到问题解决为止,而有些问题,前后 ...
- 单元测试之NUnit三
NUnit 分三篇文章介绍,入门者可阅读文章,有基础者直接参考官方文档.初次写博客,望大家指点. 导航: 单元测试之NUnit一 单元测试之NUnit二 单元测试之NUnit三 除了Assert断言外 ...
- Mybatis的一级缓存和二级缓存的理解以及用法
程序中为什么使用缓存? 先了解一下缓存的概念:原始意义是指访问速度比一般随机存取存储器快的一种RAM,通常它不像系统主存那样使用DRAM技术,而使用昂贵但较快速的SRAM技术.对于我们编程来说,所谓的 ...
- Spring Cloud Zuul的动态路由怎样做?集成Nacos实现很简单
一.说明 网关的核心概念就是路由配置和路由规则,而作为所有请求流量的入口,在实际生产环境中为了保证高可靠和高可用,是尽量要避免重启的,所以实现动态路由是非常有必要的:本文主要介绍实现的思路,并且以Na ...
- 在.net core wep项目中使用Session
第1步:添加包引用 Install-Package Microsoft.AspNetCore.Session 第2步:添加代码启用Session 在项目Startup.cs文件的ConfigureSe ...
- JAVA解除tomcat 对浏览器特别字符 | () {} [] 的限制
1.打开tomcat本机地址打开conf文件夹(一定要关闭Tomcat启动在修改) 2.记事本打开或者编辑软件打开(我这里推荐的编辑软件是以下如图) 打开进去加入这两行代码 3打开server.xml ...