原因

项目每次打包后都需要改动项目版本号,这个改动每次都需要在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. Python 使用Python操作xmind文件

    使用Python操作xmind文件 by:授客 QQ:1033553122   测试环境 Win10 Python 3.5.4 XMind-1.2.0.tar.gz 下载地址: https://fil ...

  2. 云原生 .NET Aspire 8.1 新增对 构建容器、编排 Python的支持

    .NET Aspire 用于云原生应用开发,提供用于构建.测试和部署分布式应用的框架,这些应用通常利用微服务.容器.无服务器体系结构等云构造.2024年7月23日宣布的新 8.1 版本是该平台自 5 ...

  3. 【Spring】05 注解开发

    环境搭建 配置ApplicationContext.xml容器文件[半注解实现] <?xml version="1.0" encoding="UTF-8" ...

  4. 拜登开始在YouTube上打竞选广告了 —— 美国总统的竞选广告已经开始媒体投放了

    哈哈哈,老拜登,跑到YouTube上打广告了,这个画面真的太难想象,如果美国有"椰树"广告,估计拜登能弄个泳装上去打广告.有时不得不佩服西方搞的这种全民选举,最后搞的就和看小品似的 ...

  5. 如何在jax框架的jit中快速的实现循环结构 —— Jax框架的jit编译是否可以使用循环结构

    相关: Jax框架的jit编译是否可以使用循环结构,如果使用循环结构需要注意什么 前文中给出了jit下使用python做循环结构的代码,下面再次给出这个代码,这个代码为jupyter-notebook ...

  6. 强化学习算法真的适合于你的应用吗 —— 强化学习研究方向(研究领域)现有的不足(短板、无法落地性) —— Why You (Probably) Shouldn’t Use Reinforcement Learning

    外文原文: Why You (Probably) Shouldn't Use Reinforcement Learning 地址: https://towardsdatascience.com/why ...

  7. LeetCode 上1769号 面试编程题,python编程

    原题地址: https://leetcode-cn.com/problems/minimum-number-of-operations-to-move-all-balls-to-each-box/ - ...

  8. 如何在通用异常处理时获取到方法名称(获取注解参数JoinPoint)

    1.背景 很多时候我们在梳理公共异常时,需要获取到接口的而具体名称,便于很好的提示是那个接口错误了 2.实现逻辑 1.在controller方法上的注解上写方法名称,一般使用了swagger都有方法名 ...

  9. NoSQL之事务和相关特性

    NoSQL 简介 NoSQL(NoSQL = Not Only SQL ),意即"不仅仅是SQL". 在现代的计算系统上每天网络上都会产生庞大的数据量. 这些数据有很大一部分是由关 ...

  10. 01-canvas体验

    1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="U ...