关于前端:优秀前端人必须知道的-NPM-账号管理工具-nucm

原文公布于 集体博客
掘金发表：优良前端人必须晓得的 NPM 账号管理工具 – nucm

前言

NPM 的账号和明码你是不是常常遗记？频繁切换 NPM 账号时的你是不是特地头疼？如果你刚好有下面的懊恼，当初装置 nucm 这个 node 小工具，就能够简略疾速的对 NPM 账号进行治理了。

nucm 介绍

nucm 能帮你疾速轻松地治理 NPM 账户信息。目前只对 NPM 源信息进行治理。

nucm：Npm User Change Manager（Npm 用户切换治理）

目前 nucm 次要是对 NPM 账号所创立的 Access Tokens 进行治理。Access Tokens 的作用能够简略的了解为，就是每一个 NPM 账号都能够生成不同类型的公布令牌，而公布令牌则能够间接用来做 npm 包的自动化公布。而 nucm 次要提供了一些简略操作命令，来对 Access Tokens 值进行增加和删除，以及查看和切换，从而达到治理 NPM 账号的目标。

Access Tokens 官网解释如下：

An access token is an alternative to using your username and password for authenticating to npm when using the API or the npm command-line interface (CLI). An access token is a hexadecimal string that you can use to authenticate, and which gives you the right to install and/or publish your modules.

中文翻译：

拜访令牌是应用 API 或 NPM 命令行界面（CLI）时应用您的用户名和明码进行身份验证到 NPM 的代替计划。拜访令牌是您能够用于身份验证的十六进制字符串，并为您提供装置和 / 或公布模块的权力。

哪些人会用到 nucm

大略有上面三类人：

• 1、常常遗记 NPM 账号和明码的人
• 2、有多个 NPM 账号的人
• 3、须要频繁切换 NPM 账号的人

如果你不是常常登录 NPM 账号，工夫一久，就很容易遗记本人的 NPM 账号和明码。如果你还注册了多个 NPM 账号，那么就更加容易造成记忆凌乱，可能每次登录 NPM 账号时，都须要搜索枯肠的回顾，而后进行屡次输出和撤回操作。如果咱们程序员的记忆力比个别人好，能记住账号密码，但这些账号和明码里都蕴含了大小写和特殊符号，每次输出时都须要特地谨严，不能输错一个字符，不然就登录不上了。

所以不管怎么说，咱们的确还是须要有那么一个 NPM 账号管理工具，来治理这些平时不怎么会用到的 NPM 账号密码，而 nucm 因为其命令简略和性能实用，特地受到大家的青眼，有须要的人当初就能够执行 npm install nucm -g 进行装置下载。

nucm 常用命令

Usage: nucm [options] [command]

Options:
  -v,--version                show version
  -h, --help                  display help for command

Commands:
  ls [options]                show account list
  use <name>                  switch account
  add <name> <access-tokens>  add account
  del <name>                  remove account
  localize <lang>             use localized languages
  install                     initialize
  help [command]              display help for command

nucm 我的项目实际

目前在团队日常中曾经充沛应用到了 nucm，它能帮忙我疾速切换集体账号和团队账号，真的是人人都夸 “ 好 ”！上面会简略介绍一下，首次应用时的根本操作步骤。

第一步：装置

$ npm install -g nucm # 或 yarn global add nucm

装置胜利后，执行 nucm -v 验证是否装置胜利（懂的都懂）。

第二步：增加账号

1、官网登录 NPM 账号，在页面的右上角，单击“配置文件”图片，而后单击“拜访令牌”。

<img src=”https://docs.npmjs.com/integrations/integrating-npm-with-external-services/tokens-profile.png” alt=”Screenshot of the account menu with the tokens link selected” style=”border: 1px solid rgb(153, 153, 153); margin-top: 15px; max-width: min(100%, 525px); max-height: 300px;”>

2、单击生成新的标记。

<img src=”https://docs.npmjs.com/integrations/integrating-npm-with-external-services/create-token.png” alt=”Screenshot of the create new token button” style=”border: 1px solid rgb(153, 153, 153); margin-top: 15px; max-width: min(100%, 525px); max-height: 300px;”>

3、命名您的令牌

4、抉择拜访令牌的类型（个别选 Publish, 具体查看文档阐明）

<img src=”https://docs.npmjs.com/integrations/integrating-npm-with-external-services/token-level-select.png” alt=”Screenshot of the access level selection” style=”border: 1px solid rgb(153, 153, 153); margin-top: 15px; max-width: min(100%, 525px); max-height: 300px;”>

5、点击生成令牌。

6、从页面顶部复制令牌。

7、执行 nucm add <name> <access-tokens> 增加账号, name 取一个账号名，access-tokens 就是 步骤 6 中复制的令牌（增加胜利会有控制台提醒）。例如：

$ nucm add beezen xxxxxxxxxxxxxxxx

增加账号胜利

第三步：查看账号列表

执行 nucm ls 可查看刚增加的账号是否呈现在账号列表中，例如：

# 默认显示脱敏的
$ nucm ls

  beezend -- xxxxxx......xxxx
  beezen --- xxxxxx......xxxx
* beeze ---- xxxxxx......xxxx

# 显示具体列表
$ nucm ls -l # 或 nucm ls --list

  beezend -- xxxxxxxxxxxxxxxxxxxxxxx
  beezen --- xxxxxxxxxxxxxxxxxxxxxxx
* beeze ---- xxxxxxxxxxxxxxxxxxxxxxx

第四步：切换账号

执行 nucm use <name> 可切换到指定账号，name 为 第二步 最终增加的账号名。例如：

$ nucm use beezen

已切换到账号 beezen

第五步：公布

到对应的 NPM 包目录下执行 npm publish, 则会应用 第四步 中账号的 Access Tokens 进行 NPM 包公布。

其余辅助命令

1、执行 nucm localize <lang> 可切换本地化语言如英文或中文，目前只反对 en 或 cn 两种。例如：

$ nucm localize cn

已切换到语言 cn

$ nucm localize en

Switched to language en

2、执行 nucm del <name> 可移除已增加了的账号。例如：

$ nucm add beezen xxxxxxxxxx # 增加新账号

增加账号胜利

$ nucm del beezen  # 移除账号

移除账号胜利

3、执行 nucm install 则会初始化 ~/.nucmrc 配置文件中的根本配置内容。（注：首次全局装置 nucm 包时会默认执行 nucm install 命令，个别不须要被动执行。）

$ nucm install

nucm 初始化胜利

nucm 源码解析

nucm 是一个 cli 命令行工具，其次要的外部逻辑就是应用 commander npm 包来对控制台输出的命令进行参数解析并执行指定逻辑。其设置的相干命令执行逻辑次要是来读写 ~/.nucmrc 文件中的配置信息，再来对 ~/.npmrc 文件中账号对应的 Access Token 值进行变更，从而做到可能自在切换账号的目标，具体流程图如下：

<img src=”http://img.dongbizhen.com/blog/20220304_nucm01.png” />

我的项目源码工程构造如下：

.
├── CHANGELOG.md # 版本阐明
├── LICENSE # 开源协定
├── README.md # 英文文档
├── README_CN.md # 中文文档
├── bin
│   └── index.js # cli 主入口
├── package.json # npm 包信息
├── src
│   ├── actions # 操作指令
│   │   ├── base.js
│   │   └── init.js
│   ├── index.js # 根底逻辑
│   ├── lang # 本地化形容配置文件
│   │   └── index.js
│   └── utils # 工具类
│       └── index.js
└── yarn.lock # lock

外围代码解析

整体应用 commander 进行命令治理，依据命令执行对应的 action 办法。

const program = require("commander");

const {getLangMessage} = require("../src/utils/index"); // 国际化提醒辅助函数
const {getUserList} = require("../src/actions/base");

......
program
  .command("ls")
  .option("-l,--list", getLangMessage("MSG_ls"))
  .description(getLangMessage("MSG_accountList"))
  .action(getUserList);
......

而各个 action 函数次要逻辑都是读写~/.nucmrc,~/.npmrc,~/.nrmrc 配置文件，并返回指定格局日志，典型函数如下：

/**
 * 获取用户列表
 */
function getUserList(options) {
  let npmAccountList = config.npmAccountList; // 从配置文件中获取账号列表
  let userList = Object.keys(npmAccountList)
    .map((key) => {
      // 依据 nucm ls --list 命令，是否增加 `--list` 来判断是否脱敏
      let visibleToken = options.list
        ? npmAccountList[key]["access-tokens"]
        : desensitize(npmAccountList[key]["access-tokens"]); // 脱敏解决
      if (npmAccountList[key]["is-current"]) {
        // is-current 字段为 true 的账号为以后激活账号
        return colors.green(`* ${key} ${line(key, 10)} ${visibleToken}`);
      }
      return `  ${key} ${line(key, 10)} ${visibleToken}`;
    })
    .join("\n");

  console.log(userList); // 日志打印
}

最初

nucm 真的十分好用！在前面的打算中，会反对对非 NPM 源的账号信息也进行治理，也会对官网的 npm login 等命令进行适配，同时也会着重晋升整体的交互体验，进步操作的响应效率。最初欢送开源社区的大大们可能提供更多的贵重倡议，欢送 Star + Fork + Watch 三连。

Git 我的项目地址：https://github.com/beezen/nucm