原因

项目每次打包后都需要改动项目版本号,这个改动每次都需要在package.json中修改version,比较麻烦,到底有没有一种打包后版本号自加的办法。

方案

版本号自加其实可以使用fs修改文件来实现的。

具体思路是:在执行打包命令npm run build时,同时执行一段js代码,该代码通过调用fs来自加修改package.json中的version,然后再进行打包操作。

步骤

1、在package.json中将scripts中的打包命令修改为如下:



2、在src下创建addVersion.js:



3、在addVersion.js中写入下面内容,打包时使用fs修改package.json:

//npm run build打包前执行此段代码
let fs = require('fs'); //返回package的json数据
function getPackageJson() {
let data = fs.readFileSync('./package.json');//fs读取文件
return JSON.parse(data);//转换为json对象
} let packageData = getPackageJson();//获取package的json
let arr = packageData.version.split('.');//切割后的版本号数组
arr[2] = parseInt(arr[2]) + 1;
packageData.version = arr.join('.');//转换为以"."分割的字符串
//用packageData覆盖package.json内容
fs.writeFile(
'./package.json',
JSON.stringify(packageData, null, "\t"
),
(err) => { }
);

4、最后执行打包命令:npm run build便会发现package.json中的版本号变化了。

vue打包项目版本号自加的更多相关文章

  1. Vue打包项目图片等静态资源的处理

    项目打包,默认是打包在根目录下面的.当然我们可以通过设置,打包到任意子目录中去. 但是,当项目中引入资源的,比如:引入图片资源.js资源.或者字体图标之类的.那么可能在这个中间又会踩坑. 1.在vue ...

  2. vue打包项目后使用-webkit-line-clamp: 2;这个属性不生效?

    在项目中要实现多行省略,-webkit-line-clamp: 2;打包后不生效,使用下面的方法: word-break: break-all; text-overflow: ellipsis; di ...

  3. vue项目首屏加载优化实战

    问题 单页面应用的一个问题就是首页加载东西过多,加载时间过长.特别在移动端,单页面应用的首屏加载优化更是绕不开的话题.下面我会写出我在项目中做的一些优化,希望大家能够相互讨论,共同进步. 我的项目vu ...

  4. webpack 打包和手动创建一个vue的项目

    首先我们为啥要用webpack,为啥不用其他的打包的工具. 先听我捋捋, Webpack有人也称之为 模块打包机 ,由此也可以看出Webpack更侧重于模块打包,当然我们可以把开发中的所有资源(图片. ...

  5. 将vue的项目打包后通过百度的BAE发布到网上的流程

    经过两天的研究终于将VUE打包后的项目通过BAE发布到了网上.虽然接口方面还有一下问题但是自己还是很高兴的. 首先说一下这个项目需要用到的技术,vue+express+git+百度的应用引擎BAE. ...

  6. 基于Vue + webpack + Vue-cli 实现分环境打包项目

    需求由来:我公司项目上线发布至服务器分为三个环境分别为测试环境.预发布环境.生产环境:前期做法是项目通过脚步打包时由脚步把域名和后缀名之类的全部替换成要发布的环境所需要的,因为我公司的项目比较大由许许 ...

  7. Vue + WebPack + Typescript初学者VSCode项目 (按需加载、跨域调试、await/async)

    万事开头难,一个好的Hello World程序可以节省我们好多的学习时间,帮助我们快速入门.Hello World程序之所以是入门必读必会,就是因为其代码量少,简单易懂.但我觉得,还应该做到功能丰富, ...

  8. vue.js项目打包上线

    最近一直坚持每个月写一个小的vue.js 开发的项目,最后开发完成后想到很久之前给别人回答的一个问题:vue的项目如何上线,当时有千奇百怪的回答,我在想,这些人都是肿了么,vue的官方都说了,这个框架 ...

  9. 【vue】饿了么项目-使用webpack打包项目

    1.vue cli给我们提供了npm run build命令打包项目,在packa.json文件中scripts对象中有build属性,当我们执行npm run build时,就执行build对应的& ...

  10. VUE:项目的创建、编写、打包及规范检查

    VUE:项目的创建.编写及打包 项目的创建 使用 vue-cli 创建模板项目(官方提供的脚手架工具) https://github.com/vuejs/vue-cli npm install -g ...

随机推荐

  1. ABC199E

    考虑状压. 设计状态 \(dp_{i,j}\) 表示考虑 \(i\) 个数,每个数的使用情况的二进制压缩表示为 \(j\) 的情况下的方案数. 然后去正常转移. 唯一特殊的是将限制放在点上,假若这个点 ...

  2. 如何合理开发Java接口(安全性,可重复调用,稳定性,追溯性)

    一.接口开发规范 签名:对外提供的接口要做签名认证,认证不通过的请求不允许访问接口.提供服务. 加密:敏感数据在网络传输过程中应该加密. IP白名单:限制请求的IP,增加IP白名单,一般在网关层处理. ...

  3. Vue 怎么用 vm.$set() 解决对象新增属性不能响应的问题 ?

    受现代 JavaScript 的限制 ,Vue 无法检测到对象属性的添加或删除.由于 Vue 会在初始化实例时对属性执行 getter/setter 转化,所以属性必须在 data 对象上存在才能让 ...

  4. 设置Docker容器里的时间

    启动容器时,添加环境变量 docer run -e TZ=Asia/Shanghai --rm myalpine date -e TZ=Asia/Shanghai  

  5. yb课堂 实战之路由拦截和订单模块 《四十二》

    前置守护 路由拦截功能开发 文档:https://router.vuejs.org/zh/guide/advanced/navigation-guards.html router里面配置需要登陆的路由 ...

  6. 利用Selenium和PhantomJS绕过接口加密的技术探索与实践

    selenium+phantomjs绕过接口加密 我们为什么需要selenium 之前我们讲解了 Ajax 的分析方法,利用 Ajax 接口我们可以非常方便地完成数据的爬取.只要我们能找到 Ajax ...

  7. 全网最适合入门的面向对象编程教程:03 类和对象的Python实现-为自定义类添加属性

    摘要: 本文主要介绍了,当使用 Python 创建自定义类时,如何为其添加属性,包括为类和实例添加属性两种,以及如何获取自定义的属性等内容. 往期推荐: 学嵌入式的你,还不会面向对象??! 全网最适合 ...

  8. django 信号第一个 raise ValidationError出现后,还会继续下一个if吗

    在你提供的代码片段中,如果第一个 raise ValidationError 触发,会抛出异常并停止执行当前函数或代码块.这是因为异常(Exception)会中断正常的代码流程,将控制权传递给调用堆栈 ...

  9. oeasy教您玩转vim - 50 - # 命令行效率

    ​ 命令行效率 回忆上节课内容 总结 我们上次研究的是范围命令执行方法 批量控制缩进 :20,40> 批量执行普通模式下的命令 :4,10normal A; 直接切换到全屏命令模式 ex-mod ...

  10. SQL:聚集索引和非聚集索引

    聚集(clustered)索引,也叫聚簇索引 定义:数据行的物理顺序与列值(一般是主键的那一列)的逻辑顺序相同,一个表中只能拥有一个聚集索引. 注:第一列的地址表示该行数据在磁盘中的物理地址,后面三列 ...