头像

GitHub Action 自动发布 npm 工具库记录

Oct 09, 2024

#Github Action NPM

GitHub Action 自动发布 npm 工具库记录

本文记录了我在使用 GitHub Action 来发布 npm 包的过程。

1. 获取 npm Token

在进行任何操作之前，首先需要获取 npm token。可以通过以下步骤完成：

  1. 登录到 npm 官网。
  2. 在右上角头像菜单中选择 “Access Tokens”。
  3. 生成一个新的 token，并确保将其复制保存好。

2. 自动生成 CHANGELOG

为了更好地管理版本和变更记录，可以使用 @changesets/cli 插件自动生成 CHANGELOG。使用以下命令安装：

bash
npm install @changesets/cli

3. 设置 GitHub Action npm-publish.yml 脚本

在项目的 GitHub 仓库中，设置一个 GitHub Action 来自动发布 npm 包。

  1. 进入项目地址，选择 Actions 选项卡。
  2. 点击 New workflow，选择 Publish Node.js Package 类型。
  3. 修改 npm-publish.yml 脚本。
  4. 完成修改后，点击右上角绿色按钮 Commit changes。

以下是 npm-publish.yml 脚本的示例：

yaml
# This workflow will run tests using node and then publish a package to GitHub Packages when a release is created
# For more information see: https://docs.github.com/en/actions/publishing-packages/publishing-nodejs-packages
 
name: Node.js Package
 
# 触发时机，在 main 分支 push 操作触发
on:
  push:
    branches:
      - main
 
# 默认shell
defaults:
  run:
    shell: bash
 
permissions:
  contents: write
  packages: write
  pull-requests: write
  repository-projects: write
 
# 任务，定义个changelog 的任务
jobs:
  changelog:
    # name:Changelog PR or Release
    # 这里判断仓库owner是否是我自己，为了避免别人 fork 仓库触发，请自行修改
    if: ${{ github.repository_owner == 'Lizh606' }}
    runs-on: ubuntu-latest
    steps:
      # name:  当前 step 的名字
      - name: Checkout # 获取分支的代码和提交记录
        uses: actions/checkout@v3
 
      # 设置 Node
      - name: Setup Node.js # 设置 Node.js 的环境
        uses: actions/setup-node@v3
        with:
          node-version: "16.x"
          # cache: 'npm'
 
      # 安装依赖
      - name: Install dependencies
        run: npm install
 
      # 打包
      - name: Build Packages
        run: npm run build
 
      # 这一步是最重要的。使用changesets/action自动创建 PR 或者发布
      - name: Create Release Pull Request or Publish
        id: changesets
        uses: changesets/action@v1
        with:
          # 执行更新版本和发布的命令
          version: npm run version
          publish: npm exec changeset publish
          commit: "[ci] release"
          title: "[ci] release"
        env:
          # 这里需要几个 Token 变量
          # GITHUB_TOKEN 是 CI 里自带的默认 token
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
          # NPM_TOKEN 需要稍后在 npm 网站生成。
          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}

发包流程

1、切换特性分支，生成changeset文件

bash
npm exec changeset

2、创建 Pull Request 到 main 分支

将特性分支的变更提交并创建一个 Pull Request 到 main 分支。此操作将触发 GitHub Actions 脚本，生成 changeset-release/main 分支，并自动创建一个带有 [ci] release 标记的 Pull Request。

3、合并[ci] release请求完成发包

目录