使用 Github Actions 自动发布包到 NPM 官网上

本文主要是介绍使用 Github Actions 自动发布包到 NPM 官网上，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

当我们在开发一个依赖时，我们需要发布到 npm 官网上，这样其他人才能使用我们的包。
但是每次都要手动执行 npm publish 命令，或者二次校验才能发布，这样就会很麻烦。

方式

自己写一个 node 脚本，然后在本地执行，这样就可以自动发布了。
利用 Github Actions 再开源项目上配置自动发布，例如触发条件是 git 创建 tag 就执行发布。这里介绍的是第二种方式。

配置

在 npm 官网上生成自动化授权 token

打开 npm 官网，登录自己的账号。
点击头像，选择 Access Tokens 选项。
点击 Generate New Token 按钮，选择 Classic Token 选项。
输入名称，不限制，例如：NPM_TOKEN；单选选择 Automation 选项。
点击 Generate Token 按钮生成 token，复制保存生成的 token，防止丢失，不要泄漏出去。

在 Github 项目上配置 Secrets

如果没有注册，则先注册并创建一个项目。
打开 Github 项目，点击 Settings 选项。
新创建的项目，默认是开启 Actions 功能的，如果没有开启，需要手动在 Settings 里的 Actions > General 选项开启。
点击 Secrets and variables 下的 Actions 选项，点击 New repository secret 按钮。
name：输入 NPM_TOKEN，value：输入刚才生成的 token，点击 Add secret 按钮保存。

创建 .github 工作流代码

在项目根目录下创建 .github/workflows 目录。
在 .github/workflows 目录下创建 publish.yml 文件。
publish.yml 文件内容如下：

# .github/workflows/publish.ymlname: Publish Package to npmjson:push:tags:- 'v*'jobs:build:runs-on: ubuntu-latestpermissions:contents: readid-token: writesteps:- uses: actions/checkout@v4- uses: actions/setup-node@v4with:node-version: '20.x'registry-url: 'https://registry.npmjs.org'- run: npm install -g npm- run: npm ci- run: npm publishenv:NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

name：任务名称。
on：触发条件，这里是 git 创建 tag 时触发。
jobs：任务列表。
build：任务名称。
runs-on：运行环境。
permissions：权限设置。
steps：步骤列表。
- uses：使用的 action。
- with：参数设置。
- run：执行命令。
- env：环境变量设置。这里的 NPM_TOKEN 就是上面配置的 Secrets 的 name。

创建 package.json 文件

在项目根目录下创建 package.json 文件。
执行一下命令

npm init -y

配置 Provenance 选项
也可以使用其它方式配置，更多配置请参考官方文档

{"publishConfig": {"registry": "https://registry.npmjs.org/","provenance": true}
}

完整代码参考

{"name": "mine-npm-demo","version": "1.0.0","description": "This is a sample demo about npm","main": "index.js","private": false,"scripts": {},"keywords": ["npm","demo"],"engines": {"node": ">=20"},"type": "module","author": {"name": "biaov","email": "biaov@qq.com"},"license": "ISC","repository": {"type": "git","url": "git+https://github.com/biaov/mine-npm-demo.git"},"homepage": "https://github.com/biaov/mine-npm-demo","bugs": {"url": "https://github.com/biaov/mine-npm-demo/issues"},"publishConfig": {"registry": "https://registry.npmjs.org/","provenance": true},"contributors": [{"name": "biaov","email": "biaov@qq.com"}]
}