再也不用手动改package.json的版本号

更新日期: 2023-05-12阅读: 1.3k标签: package

本文的起因是有在代码仓库发包后,同事问我“为什么package.json 里的版本还是原来的,有没有更新?”,这个时候我意识到,我们完全没有必要在每次发布的时候还特意去关注这个仓库的版本号,只要在发布打tag的时候同步一下即可,于是有了本文的实践。


node.js 部分,我们得有一个更改仓库代码的脚本留给ci执行

我们首先需要在工程目录中的 ./script/..目录下增加一个 update-version.js脚本


//update-version.js

const path = require('path');
const fs = require('fs');
const newVersion = process.argv[2].replace(/^v/, '');; // 获取命令行参数中的新版本号,并过滤v字头

if (!newVersion) {
    console.log('请传入新版本号,版本号遵循semver规范 .eg: 1.0.0, 1.0.1, 1.1.0');
    process.exit(1);

}

// 获取当前命令行上下文路径

const currentDirectory = process.cwd();

// 获取 package.json 文件中的版本号
const packageJsonPath = path.join(currentDirectory, 'package.json');
const packageJsonContent = fs.readFileSync(packageJsonPath, 'utf8');
const packageJson = JSON.parse(packageJsonContent);
const currentVersion = packageJson.version;

// 更新 package.json 文件中的版本号

packageJson.version = newVersion;
fs.writeFileSync(packageJsonPath, JSON.stringify(packageJson, null, 2));
console.log(`版本号已从 ${currentVersion} 更新为 ${newVersion}`);


接下来在 package.json script 配置后可以直接使用 npm run version <version> 中触发变更版本号脚本。当然这个前提是想要让这个脚本保留给开发者命令行使用。


{

    "name": "version workflow",
    "version": "1.0.0",
    "description": "version update demo",
    "main": "index.js",
    "scripts": {
        //...
        "version": "node ./scripts/update-version.js"
    },
    //...

}


CI :如何让发布包的行为直接和代码仓库中的版本号同步?

接下来算重头戏,如何让发布包的行为直接和代码仓库中的版本号同步?这里我们使用的是github 提供的github action,具体操作和语法可以查看一下官方文档,本文就不过多展开。

我们需要在仓库根目录增加如下路径的文件 .github/workflows/update-action.yml

name: Update Package Version

on:
  release:
    types: [released]

jobs:
  update:
    runs-on: ubuntu-latest
    steps:

      - name: Checkout code
        uses: actions/checkout@v3

     - name: Update package.json
       run: |
         node ./scripts/update-version.js ${{ github.event.release.tag_name }}
       env:
         GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

     - name: Commit changes
       run: |
         git config user.name "Your github name"
         git config user.email "your github email"
         git add .
         git commit -m "Update version to ${{ github.event.release.tag_name }} for release ${{ github.ref }}"

     - name: Push changes
       uses: ad-m/github-push-action@master
       with:
         github_token: ${{ secrets.GITHUB_TOKEN }}


我们在 release hook 中的 released 状态下增加了一个 update job。它会做下面几件事情(在脚本步骤中有)

  1. 【Checkout code】 切出新的代码分支;
  2. 【 Update package.json】在新分支执行 update-version.js 传入tag_name更新我们的工程版本号;
  3. 【Commit changes】以你定制的 git config user 信息创建一个新提交;
  4. 【Push changes】推送变更回到主干;

ps:正确来说应该在发布执行动作前prereleased执行我们的 job 但是没用这个的原因如下:

**Note:**The prereleased type will not trigger for pre-releases published from draft releases, but the published type will trigger. If you want a workflow to run when stable and pre-releases publish, subscribe to published instead of released and prereleased.

当这个脚本推送后,执行发布后自动更新版本,不用在关注这个版本修改问题。你会得到下面的效果。

在你的仓库发布界面填写正确tag后发布


触发update job 更改完成



你可能遇到最多的坑

  1. action 执行失败
Process completed with exit code 129." Node.js 12 actions are deprecated. Please update the following actions to use Node.js 16: actions/checkout@v2. For more information, see https://github.blog/changelog/2022-09-22-github-actions-all-actions-will-begin-running-on-node16-instead-of-node12/.

这是由于默认action job 执行环境的nodejs 版本与actions 包中执行脚本不匹配导致,所以一定要使用 checkout@v3 版本 actions/checkout@v3

  1. 各种不熟悉 action 语法取值导致的问题


可以优化的地方

我们前面提交的这个流程发布还是有个问题,你永远有个更超前的 commit hash 在你发布的 tag 之后


所以这个action 还有需要继续优化的地方,那就是同步更新tag hash

name: Update Package Version

on:
  release:
    types: [released]

jobs:
  update:
    runs-on: ubuntu-latest
    steps:

      - name: Checkout code
        uses: actions/checkout@v3

     - name: Update package.json
       run: |
         node ./scripts/update-version.js ${{ github.event.release.tag_name }}
       env:
         GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

     - name: Commit changes
       run: |
         git config user.name "Your github name"
         git config user.email "your github email"
         git add .
         git commit -m "Update version to ${{ github.event.release.tag_name }} for release ${{ github.ref }}"
         git_hash=$(git rev-parse --short HEAD)

     - name: Push changes
       uses: ad-m/github-push-action@master
       with:
         github_token: ${{ secrets.GITHUB_TOKEN }}

    - name: Tag Push changes
      run: |
        git tag -f ${{ github.event.release.tag_name }} $git_hash
        git push --force origin ${{ github.event.release.tag_name }}
      env:
        GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}


这里相比之前的版本增加了 Tag Push changes 这个步骤,在最后获取这个版本更新产生的 $git_hash强制更新到发布的 tag 上。

我们看看效果


最后我们看版本发布管理中的 tag hash


搞定!


可以再优化的地方

现在我们还有个问题,就是在执行 Commit changes 这个步骤时每次 git config user.name "Your github name" git config user.email "your github email" 这里是写死的,我们可以根据 GitHub Actions 中有一些预设的环境变量可以读取到当前用户的账号和邮箱信息。通过 ${{ env.GITHUB_ACTOR }} 获取到当前执行的 Actions 的用户账号,通过 ${{ env.GITHUB_ACTOR }}@users.noreply.github.com 获取到当前执行的 Actions 的用户邮箱(该邮箱为 noreply 邮箱,用于 GitHub 的通知,无法发送邮件)。注意,该邮箱不一定是用户本身的真实邮箱,可能是 GitHub 默认的邮箱。

如果需要获取当前 GitHub 账号的真实邮箱地址,可以通过 GitHub REST api 进行查询,具体可以参考官方文档:https://docs.github.com/en/rest/reference/users#get-the-authenticated-user

这样我们就需要在Commit Changes之前再加一个Set Git user步骤

- name: Set Git user
  env:
    GITHUB_ACTOR: ${{ github.actor }}
    GITHUB_EMAIL: ${{ github.actor }}@users.noreply.github.com
  run: |
    git config --global user.name "${{ env.GITHUB_ACTOR }}"
    git config --global user.email "${{ env.GITHUB_EMAIL }}"

这样我们最终的 Github action 脚本长这样


name: Update Package Version

on:
  release:
    types: [released]

jobs:
  update:
    runs-on: ubuntu-latest
    steps:

      - name: Checkout code
        uses: actions/checkout@v3

     - name: Update package.json
       run: |
         node ./scripts/update-version.js ${{ github.event.release.tag_name }}
       env:
         GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
    
     - name: Set Git user
       env:
         GITHUB_ACTOR: ${{ github.actor }}
         GITHUB_EMAIL: ${{ github.actor }}@users.noreply.github.com
       run: |
         git config --global user.name "${{ env.GITHUB_ACTOR }}"
         git config --global user.email "${{ env.GITHUB_EMAIL }}"
 
     - name: Commit changes
       run: |
         git add .
         git commit -m "Update version to ${{ github.event.release.tag_name }} for release ${{ github.ref }}"
         git_hash=$(git rev-parse --short HEAD)

     - name: Push changes
       uses: ad-m/github-push-action@master
       with:
         github_token: ${{ secrets.GITHUB_TOKEN }}

    - name: Tag Push changes
      run: |
        git tag -f ${{ github.event.release.tag_name }} $git_hash
        git push --force origin ${{ github.event.release.tag_name }}
      env:
        GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

作者:Jervis_cen
链接:https://juejin.cn/post/7220164534316433467

链接: https://fly63.com/article/detial/12478

package.json的所有配置项及其用法,你都熟悉么

在前端开发中,npm已经是必不可少的工具了。使用npm,不可避免的就要和package.json打交道。平时package.json用得挺多,但是没有认真看过官方文档。本文结合npm官方文档以及自己平时使用过程中的感悟

Node.js中package.json中库的版本号

最近总是碰到一些问题, 在本地好好的, 在线上就出现了问题, 本地也一直复现不了, 后来把node_modules目录删除了之后, 重新安装, 就在本地复现了这个问题,可以看了git history, 并没有人修改package.json中的版本号,于是认真的了解了一下package.json中库的版本号;

package.json 和 package-lock.json 文件说明

在 Node.js 中,模块是一个库或框架,也是一个 Node.js 项目。Node.js 项目遵循模块化的架构,当我们创建了一个 Node.js 项目,意味着创建了一个模块,这个模块的描述文件,被称为 package.json。

package.json中你还不清楚的browser,module,main 字段优先级

前端开发中使用到 npm 包那可算是家常便饭,而使用到 npm 包总免不了接触到 package.json 包配置文件。那么这里就有一个问题,当我们在不同环境下 import 一个 npm 包时,到底加载的是 npm 包的哪个文件?

逐行理解create-react-app中的package.json

下面是我的react项目初始化之后的package.json文件,除了个别自己新增依赖以外,基本是create-react-app生成的默认配置,下面是对package.json中每一行(除jest之外)的解释:

Package.json详解

前端需要学习的东西真的挺多的,之前主要从事的是MVC框架,操作DOM,使用JQUERY比较多,不知到什么时候,发现现在前端MVVM是主流,不得不把之前的大部分东西丢掉,作为前端婴儿不断前行。

package.json 与 package-lock.json 的区别

根据官方文档,这个package-lock.json 是在 `npm install`时候生成一份文件,用以记录当前状态下实际安装的各个npm package的具体来源和版本号。它有什么用呢?因为npm是一个用于管理package之间依赖关系的管理器

什么是package.json文件?了解package.json常见属性

Node 项目在项目根目录中名为 package.json 的文件中跟踪依赖关系和元数据。这是你项目的核心。它包含名称、描述和版本之类的信息,以及运行、开发以及有选择地将项目发布到 NPM 所需的信息。

关于前端大管家 Package.Json,你知道多少?

在每个前端项目中,都有package.json文件,它是项目的配置文件,常见的配置有配置项目启动、打包命令,声明依赖包等。package.json文件是一个JSON对象

深入浅出 package.json,目测大多数人不了解它

package.json中也存在很多三方属性,比如tsc中使用的types、构建工具中使用的sideEffects,git中使用的husky,eslint使用的eslintIgnore,这些扩展的配置,针对特定的开发工具是有意义的这里不一一举例。

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!