vue打包项目版本号自加的操作步骤

 更新时间:2022年09月21日 14:17:48   作者:曦12  
项目每次打包后都需要改动项目版本号,这个改动每次都需要在package.json中修改version,比较麻烦,到底有没有一种打包后版本号自加的办法,这篇文章主要介绍了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打包项目版本号自加内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • Vue中watch使用方法详解

    Vue中watch使用方法详解

    watch就是当值第一次绑定的时候,是不会执行监听函数的,只有值诞生改变才会执行。如果需要在第一次绑定的时候也执行函数,则需要用到immediate属性,比如当父组件向子组件动态传值时,子组件props首次获取到父组件传来的No认知时,也需要执行函数
    2023-01-01
  • vue导入新工程 “node_modules依赖”问题

    vue导入新工程 “node_modules依赖”问题

    这篇文章主要介绍了vue导入新工程 “node_modules依赖”问题,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-09-09
  • Vue+Openlayers实现实时坐标点展示

    Vue+Openlayers实现实时坐标点展示

    这篇文章主要为大家详细介绍了Vue+Openlayers实现实时坐标点展示,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-03-03
  • 一文详解Vue中可重用组件的3个主要问题

    一文详解Vue中可重用组件的3个主要问题

    当我们谈论或讨论在 Vue 中创建用户界面组件时,经常会提到可重用性,在 Vue 中创建真正的可重用组件可能很棘手,在本文中,我将探讨可重用组件的概念、应用这些组件时面临的问题,以及为什么必须尽可能克服这些问题,需要的朋友可以参考下
    2023-10-10
  • Vue首屏性能优化组件知识点总结

    Vue首屏性能优化组件知识点总结

    在本篇文章里小编给大家整理了一篇关于Vue首屏性能优化组件知识点总结,有需要的朋友们可以跟着学习下。
    2021-11-11
  • vue列表如何自动滚动到制定位置

    vue列表如何自动滚动到制定位置

    这篇文章主要介绍了vue列表如何自动滚动到制定位置问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2023-10-10
  • Vue应用qs插件实现参数格式化示例详解

    Vue应用qs插件实现参数格式化示例详解

    这篇文章主要为大家介绍了Vue应用qs插件实现参数格式化示例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-09-09
  • vue项目中使用rem,在入口文件添加内容操作

    vue项目中使用rem,在入口文件添加内容操作

    这篇文章主要介绍了vue项目中使用rem,在入口文件添加内容操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-11-11
  • 基于Vue中使用节流Lodash throttle详解

    基于Vue中使用节流Lodash throttle详解

    今天小编就为大家分享一篇基于Vue中使用节流Lodash throttle详解,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-10-10
  • vue+elementUI用户修改密码的前端验证规则

    vue+elementUI用户修改密码的前端验证规则

    用户登录后修改密码,密码需要一定的验证规则,这篇文章主要介绍了vue+elementUI用户修改密码的前端验证,需要的朋友可以参考下
    2024-03-03

最新评论