使用Npm Token免登陆发包

发表于 更新于 分类于 阅读次数： 本文字数： 1.3k 阅读时长 ≈ 5 分钟

在使用 npm 包管理器进行包的发布时，通常需要手动登录 npm 账户，并且我们在本地使用npm时因为某些不可抗原因，使用了非npm官方源，导致我们每次发布都需要切换到官方源，显得非常繁琐。现在，通过使用 npm Token，可以避免手动登录，切换源等步骤，实现自动化发布流程，特别是在持续集成/持续部署（CI/CD）环境中。

1. 准备工作

在开始之前，请确保：

  • 你的项目中包含一个 package.json 文件。
  • 你有一个 npm 账户，并且已经获取了 npm token。
  • 你即将发布的包的包名没有被占用。

获取Access Token

通过登陆官网获取

确保记录下生成的 Token，因为它只会在创建的时候显示一次，刷新后不会再次显示，如果忘记就只能重新申请

首先登陆npm官网，然后点击Access Tokens：

image.png

然后进入access Tokens生成页面:

image.png

两者任选一个点击进入，两者都可以作为token在github actions中使用，只是Classic Token设置更简单，Granular Access Token设置更多，控制更精细化

点击Classic Token后：一定勾选publish，后面才能正常从github actions推送

image.png

点击：Granular Access Token，红框勾选的三个必填：

  • Token name：不必多说，token名字，起一个你喜欢的
  • Expiration：有效期，默认三十天，可以改得更长，过期后需要重新生成
  • Permissions：权限，即生成的token能做什么样的操作，同样需要选择 read && write，不然github actions执行是无法推送
  • 其余的选项可以根据需要适当勾选

填写完成后，滑到底部点击Generate token按钮

image.png

通过命令行获取

需要现在本地执行npm login登陆，然后调用文档的命令生产token，具体可以看下官方文档：
Creating and viewing access tokens | npm Docs

2. 如何免登陆发布npm包

创建.npmrc文件

前面你已经生成了一个npm的具有publish或者write权限的access token。
那么你只需在项目根目录下创建 .npmrc 文件，写入以下内容这个文件将包含 npm registry 的授权信息。

1
//registry.npmjs.org/:_authToken=你刚刚申请的token

或者直接在项目根目录命令行执行，将会自动生成：

1
echo "//registry.npmjs.org/:_authToken=你刚刚申请的token" > .npmrc

然后，将 .npmrc 文件添加到你的版本控制系统中。

发布

将你准备发布的文件，编译好。假设你已经准备好了，那么就愉快的执行：

1
2
3
4
5
6
7
8
9
10
11
12
13
npm logout
npm publish

# 将会输出下面类似字样，就是成功了
# ...
# npm notice package size: 12.6 kB
# npm notice unpacked size: 84.1 kB
# npm notice shasum: d282cbe9374611e6d10d6fb30215f61bb6c95c89
# npm notice integrity: sha512-N4iu+YUebBPCP[...]21dOqKE6G43iQ==
# npm notice total files: 18
# npm notice
# npm notice Publishing to [https://registry.npmjs.org/](https://registry.npmjs.org/) with tag latest and default access
# ...

或者登陆npm官网，查看刚刚发布的包

如果你没有成功，出现如下报错：

1
npm ERR! need auth You need to authorize this machine using `npm adduser` [https://docs.npmjs.com/using-private-packages-in-a-ci-cd-workflow](https://docs.npmjs.com/using-private-packages-in-a-ci-cd-workflow)

有三个可能原因：

  • 确保你的.npmrc文件路径，命名和内容正确
  • 确保你的access token正确，或者具有publish或write权限
  • 由于某些不可描述原因，你将本地npm的源设置为其他源，没有设置为https://registry.npmjs.org，比如腾讯源，阿里云云等，此时需要切换过来才能正确

至此，你已经做到免登陆发布包了，但别急，这还没完。

这样安全吗？

如果你真像上面这样做了，那你npm仓库的安全就没有了。

为什么呢，因为你刚刚申请的access token有读写仓库的权限，你如果随着你的代码提交到仓库，就会将他暴露出去，造成损失，那么怎么做才安全呢？下面会将

更安全的免登陆发包

忽略.npmrc

将.npmrc加入到.gitignore文件中，不提交到代码仓库，只在你本地使用

变量

在.npmrc使用变量

将.npmrc改成如下内容：

1
//registry.npmjs.org/:_authToken=${NPM_PUBLISH_TOKEN}

NPM_PUBLISH_TOKEN是我们后面要设置的全局变量

设置全局变量

在全局变量（环境变量）中设置NPM_PUBLISH_TOKEN为你刚刚申请的token

不同的平台设置方式不一样：

linux和mac平台可以通过编辑.bashrc或者.zshrc文件实现：

  • 打开.bashrc或者.zshrc编辑
1
vi ~/.bashrc
  • 在文件内容末尾追加：
1
export NPM_PUBLISH_TOKEN=你刚刚申请的token
  • 然后执行source命令使其生效
1
source ~/.bashrc

如果提示没有权限加上sudo

window平台可以直接打开高级属性界面设置

未完待续

当然可以看出在本地使用token还是有很多限制，没有彻底解放生产力，后续我会出一篇文章讲述如何结合CI/CD去实现自动化发包

重要

任何时候都不要将access token相关的信息暴露到公网上，以免造成不必要损失

参考

1.Creating and viewing access tokens | npm Docs
2.Using private packages in a CI/CD workflow | npm Docs
3.Working with the npm registry - GitHub Docs