vue打包项目版本号自加
原因
项目每次打包后都需要改动项目版本号,这个改动每次都需要在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打包项目版本号自加的更多相关文章
- Vue打包项目图片等静态资源的处理
项目打包,默认是打包在根目录下面的.当然我们可以通过设置,打包到任意子目录中去. 但是,当项目中引入资源的,比如:引入图片资源.js资源.或者字体图标之类的.那么可能在这个中间又会踩坑. 1.在vue ...
- vue打包项目后使用-webkit-line-clamp: 2;这个属性不生效?
在项目中要实现多行省略,-webkit-line-clamp: 2;打包后不生效,使用下面的方法: word-break: break-all; text-overflow: ellipsis; di ...
- vue项目首屏加载优化实战
问题 单页面应用的一个问题就是首页加载东西过多,加载时间过长.特别在移动端,单页面应用的首屏加载优化更是绕不开的话题.下面我会写出我在项目中做的一些优化,希望大家能够相互讨论,共同进步. 我的项目vu ...
- webpack 打包和手动创建一个vue的项目
首先我们为啥要用webpack,为啥不用其他的打包的工具. 先听我捋捋, Webpack有人也称之为 模块打包机 ,由此也可以看出Webpack更侧重于模块打包,当然我们可以把开发中的所有资源(图片. ...
- 将vue的项目打包后通过百度的BAE发布到网上的流程
经过两天的研究终于将VUE打包后的项目通过BAE发布到了网上.虽然接口方面还有一下问题但是自己还是很高兴的. 首先说一下这个项目需要用到的技术,vue+express+git+百度的应用引擎BAE. ...
- 基于Vue + webpack + Vue-cli 实现分环境打包项目
需求由来:我公司项目上线发布至服务器分为三个环境分别为测试环境.预发布环境.生产环境:前期做法是项目通过脚步打包时由脚步把域名和后缀名之类的全部替换成要发布的环境所需要的,因为我公司的项目比较大由许许 ...
- Vue + WebPack + Typescript初学者VSCode项目 (按需加载、跨域调试、await/async)
万事开头难,一个好的Hello World程序可以节省我们好多的学习时间,帮助我们快速入门.Hello World程序之所以是入门必读必会,就是因为其代码量少,简单易懂.但我觉得,还应该做到功能丰富, ...
- vue.js项目打包上线
最近一直坚持每个月写一个小的vue.js 开发的项目,最后开发完成后想到很久之前给别人回答的一个问题:vue的项目如何上线,当时有千奇百怪的回答,我在想,这些人都是肿了么,vue的官方都说了,这个框架 ...
- 【vue】饿了么项目-使用webpack打包项目
1.vue cli给我们提供了npm run build命令打包项目,在packa.json文件中scripts对象中有build属性,当我们执行npm run build时,就执行build对应的& ...
- VUE:项目的创建、编写、打包及规范检查
VUE:项目的创建.编写及打包 项目的创建 使用 vue-cli 创建模板项目(官方提供的脚手架工具) https://github.com/vuejs/vue-cli npm install -g ...
随机推荐
- 【韦东山】嵌入式全系统:单片机-linux-Android对硬件操作的不同侧重点
我是韦东山,一直从事嵌入式Linux培训,最近打算连载一系列文章. 正在录制全新的嵌入式Linux视频,使用新路线,不再从裸机/uboot开始,效率更高. 对应文档也会写成书<<嵌入式Li ...
- yb课堂 视频详情页模块开发《三十八》
CourseDetail基础模块开发 CourseDetail模块开发,拆分组件 CourseDetail.vue Header.vue Course.vue Tab.vue Summary.vue ...
- yb课堂之个人信息接口开发 《十三》
根据token从查询个人信息接口开发 直接解密token,获取个人信息 通过token解密查询数据库获取个人信息 UserController.java package net.ybclass.onl ...
- 构筑开放式大数据架构,Apache Kyuubi和NDH荣登开源OSCAR
[点击了解更多网易大数据技术] 在9月16日召开的"2022 OSCAR开源产业大会"上,中国信息通信研究院发布了一系列开源研究成果和开源表彰,网易数帆发起的开源项目Apache ...
- windows下mysql服务局域网访问配置
在局域网中访问本机(Windows)的MySQL服务器,需要确保MySQL服务器配置为允许远程访问,并且防火墙设置允许外部连接.以下是详细的步骤: 1. 修改MySQL配置文件允许远程访问 找到并编辑 ...
- ffmpeg一些笔记: 代码调试数据
1.AAC,MP3他的解码数据格式不支持,程序中给的是这个AV_SAMPLE_FMT_FLTP, Screen-Cpature-Recoder的codec-id为AV_CODEC_RAW_VIDEO ...
- lambda表达式用法
(参数列表)->{代码块}; (int a,int b)->{return a+b;}; 本质为匿名函数 参数的类型可以省略: (a,b)->{return a+b;} 当参数只有一 ...
- 2、SpringMVC之入门案例
2.1.环境搭建 2.1.1.右击project创建新module 2.1.2.选择maven 2.1.3.设置module名称和路径 2.1.4.module初始状态 2.1.5.配置打包方式 注意 ...
- 【SpringBoot】12 Web开发 Part3 SpringMVC扩展
例如我们习惯于SSM的xml配置, 这是使用MVC的容器跳转方式 <?xml version="1.0" encoding="UTF-8"?> &l ...
- 【Java-GUI】03 事件监听
--1.监听机制案例 简答理解:操作驱动程序执行 完整的操作体系:事件源.事件.监听器.注册监听 案例: 点击OK按钮,让上方的输入框写入一段字符 package cn.dzz; import jav ...