发布npm的多种方法：npm publish / yarn publish / Github

目录：
一、npm和github package的基本概念

二、常规上传至npm公共注册表方法（推荐使用nrm进行镜像切换）

npm publish

yarn publish

三、推送至github npm package方法

一、npm和github package的基本概念

npm注册表：可理解为npm的官方公共注册表的各种镜像链接

国内常用镜像（淘宝镜像）： https://registry.npm.taobao.org
npm官方镜像： https://registry.npmjs.org
yarn 官方镜像：https://registry.yarnpkg.com/
个人github镜像：https://npm.pkg.github.com/OWNER （OWNER为github个人账户名称）

npm package：在npm官网的公共注册表中，上传的modules
github package：github可支持上传多种类型打包项目。且因github已收购npm，所以可以上传包括npm类型在内的各种package

仓库首页即可找到github package位置

github package类型

参考文档

github npm package 英文参考文档
github npm package 中文参考文档
备注：中文文档可能存在翻译问题，请以英文版本为主

二、常规上传至npm公共注册表方法（npm publish / yarn publish)：

使用NPM镜像源进行上传

// 切换注册表至npm官方注册表
// 1.1. npm注册用户（若无npm账号）
npm adduser --registry https://registry.npmjs.org/

// 1.2. npm 登录（若已有npm账号）
npm login --registry https://registry.npmjs.org/
// username和password请填入npm用户名和密码

// 2. npm发布package
npm publish --registry https://registry.npmjs.org/

// 备注：其他相关方法：
npm whoami // 查询当前登录账号
npm config set registry https://registry.npmjs.org/   // 全局修改npm注册表

使用yarn镜像源和yarn命令进行上传（对于使用npm镜像经常出现网络连接失败的情况下，建议尝试yarn）

// 1. 切换至yarn镜像源（nrm命令详解位于下方）
nrm use yarn

// 2. 登录npm账号，同样需要输入
yarn login

// 3. 发布
yarn publish

操作

发布结果

推荐切换注册表方法：nrm包

// 1. 全局安装nrm包
$ npm install -g nrm 

// 2. 查看可选npm源
$ nrm ls
// 显示结果：
* npm -------- https://registry.npmjs.org/
  yarn ------- https://registry.yarnpkg.com/
  cnpm ------- http://r.cnpmjs.org/
  taobao ----- https://registry.npm.taobao.org/
  nj --------- https://registry.nodejitsu.com/
  npmMirror -- https://skimdb.npmjs.com/registry/
  edunpm ----- http://registry.enpmjs.org/

// 3. 切换npm源（以淘宝镜像为例）：
$ nrm use taobao
// 显示结果：
   Registry has been set to: https://registry.npm.taobao.org/

// 4. 测试各镜像源速度：
$ nrm test
// 显示结果
  npm ---- Fetch Error
* yarn --- 6281ms
  cnpm --- 2330ms
  taobao - 1865ms
  nj ----- Fetch Error
  npmMirror  5762ms
  edunpm - Fetch Error

// 指定某一镜像源进行测试，建议在上传先测试速度
$ nrm test taobao
// 显示结果
  taobao - 187ms

// 注意：若当前项目根文件夹存在.npmrc文件，且文件中已配置registry时，使用nrm进行全局切换对当前项目无效

注意：
对于常规方法，国内使用https://registry.npmjs.org/存在可能无法访问等网络情况

三、推送至github npm package方法：

参考文档：Configuring npm for use with GitHub Packages
（该文档有中文版本，可网页上方进行切换）

项目文件的根文件夹，创建一个.npmrc文件，并写入以下内容：

registry=https://npm.pkg.github.com/OWNER
// 备注：OWNER部分写入你的github用户名，代表指向你的github作用域

package.json添加仓库信息和发布配置信息，以保证多次发布均至同一仓库：

"repository" : {
    "type" : "git",
    "url": "ssh://git@github.com/OWNER/REPOSITORY.git",
    "directory": "packages/name"
  },
"publishConfig": {
    "registry":"https://npm.pkg.github.com/"
  },

修改package.json中package名称：

"name": "@OWNER/project_name"

// 其中OWNER为github用户名，project_name是该package名称

上传前需检查package.json中的版本号是不是和已有版本重复，例如"version": "0.1.0"
上传项目/更新项目至github仓库：

上传项目至仓库
设置github token以用于发布package到github：
6.1. 点击用户头像，选择settings
6.2. 选择Developer Settings

Developer Settings

6.3. 选择Personal Access Token

Personal Access Token

6.4. 点击右上角Generate New Token
6.5 填写该token相关描述，并选中所有项
6.6 点击底部Generate Token，则会生成一个github token，该token仅此次会显示内容，请注意保存，刷新页面后就会隐藏

填写所有信息，并生成token

生成token结果（已做脱敏处理）
前往仓库设置，将token放入该仓库配置中：
7.1. 打开仓库设置

仓库设置

7.2. 选择settings中的Secrets，点击 New repository secret

新建secrets.png

7.3. 填入token至value

将token填入value栏

新增成功
npm登录

npm login --scope=@OWNER
// OWNER为个人用户名
// username请填入你的npm用户名（不是github用户名）
// password请填入上面生成的github token
// email请填入邮箱地址

npm login至个人github

npm 发布package：

npm publish

发布成功

前往网页中查看：

仓库首页出现package信息

点击查看该npm包详细内容
注意：该方法产生的npm包，不会出现在npm官网上

发布npm的多种方法：npm publish / yarn publish / Github

一、npm和github package的基本概念

二、常规上传至npm公共注册表方法（npm publish / yarn publish)：

推荐阅读更多精彩内容