npm发布包教程(二):发布包

本文详细介绍了如何发布npm包,包括注册npm账户、使用nrm管理仓库、创建并发布unscoped和scoped包的步骤,以及解决发布过程中可能遇到的问题。文章强调了包的基本结构要求和仓库切换的重要性,并提供了出错情况的解决方案。

上一篇文章《npm发布包教程(一):从npm说起》中我们介绍了npm相关的一些知识,旨在让大家对npm有一些深入的理解,这一篇我们正式开始演示发布过程。

一、准备工作

在正式开始演示前,我们还需要做两项准备工作:

1.注册npm账户
注册地址

全名:
邮箱:
用户名:重要!发布scoped包时会用到
密码:
2.全局安装nrm

npm i nrm -g

nrm是npm仓库管理的软件,可用于npm仓库的快速切换

nrm 常用命令:

 nrm //展示nrm可用命令
 nrm ls //列出已经配置的所有仓库
 nrm test //测试所有仓库的响应时间
 nrm add <registry> <url> //新增仓库
 nrm use <registry> //切换仓库

二、发布包

开始演示前做两个简短说明:
(1)npm官方建议规范的包至少包含:

  • package.json(包的基本信息)
  • README.md(文档)
  • index.js (入口文件)

后续的演示都遵循此规范。

(2)本次仅演示个人账户的包发布,包括一个unscoped包和一个scoped的包。团体账户下的包发布流程和个人账户差别不大,在此不做展开。

1.发布unscoped包

djf-test-pkg

第一步:创建项目

(1)创建工程文件夹

mkdir djf-test-pkg && cd djf-test-pkg

(2)创建package.json

npm init

按照提示一步步完善即可,也可使用npm init -y使用npm默认设置,稍后再通过编辑package.json修正。
注意:本次演示的包的入口文件是index.js,请务必确保package.json中字段main对应的值是“index.js”。
最终结果:

{
  "name": "djf-test-pkg",
  "version": "1.0.0",
  "description": "my first npm package",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [
    "npm",
    "packge"
  ],
  "author": "djf",
  "license": "ISC"
}

(3)创建README.md
内容:

### djf-test-pkg

This is my first npm package!

It is just for learning.

(4)创建index.js
内容:

module.exports = {
    printMsg: function () {
        console.log('this message is from djf-test-pkg!');
    }
}

最终的目录结构:

└── djf-test-pkg
    ├── README.md
    ├── index.js
    └── package.json

第二步:发布

npm publish

可能报的错:
(1)未登录

npm ERR! code ENEEDAUTH
npm ERR! need auth auth required for publishing
npm ERR! need auth You need to authorize this machine using npm adduser

解决办法:npm adduser
输入:

用户名(忘记的话,去npm网站查看:头像 > Profile Settings)
密码
邮箱

(2)仓库地址不对

npm ERR! code E409
npm ERR! Registry returned 409 for PUT on http://r.cnpmjs.org/-/user/or...:yuyy: conflict

原因:通过nrm ls 命令查看我此时的仓库地址为cnpm,而不是npm

解决办法:用nrm切换到npm仓库,执行命令nrm use npm

以上问题解决后再次执行发布命令npm publish,发布成功!

在这里插入图片描述

第三步:去npm 官网搜索

有可能有延迟,不能立马看不到。
在这里插入图片描述

2.发布scoped包

@duanjiefei/babel

第一步:创建项目

(1)创建工程文件夹

mkdir babel && cd babel

(2)创建package.json

npm init -y

按提示操作,最终结果:

{
  "name": "babel",
  "version": "1.0.0",
  "description": "my scoped test package",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [
    "npm",
    "package"
  ],
  "author": "duanjiefei",
  "license": "ISC"
}

(3)创建README.md
内容:

### @duanjiefei/babel

This is my scoped npm package!

It is just for learn.

(4)创建index.js
内容:

module.exports = {
    printMsg: function () {
        console.log('this message is from @duanjiefei/babel!');
    }
}

最终的目录结构:

└── babel
    ├── README.md
    ├── index.js
    └── package.json

第二步:发布

npm publish

报错:没有发布权限

npm ERR! publish Failed PUT 401
npm ERR! code E401
npm ERR! This package requires that publishers enable TFA and provide an OTP to publish. For more info, visit: https://go.npm.me/2fa-guide : babel

原因:已经存在babel包,而我又不是babel的发布者

解决:包名和域名差不多,先到先得,如果我非要发布一个叫babel的包,只能给它加作用域放到我的命名空间下

第三步:加作用域

npm init --scope=@duanjiefei -y

@符号后面的是你注册npm账户时的username,如果不记得可以通过npm whoami查询。
上面的命令其实是在重新生成package.json,只是会给包增加了作用域,执行完后package.json现在的内容:

{
  "name": "@duanjiefei/babel",
  "version": "1.0.0",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "duanjiefei",
  "license": "ISC",
  "description": ""
}

唯一的变化是name字段由原来的babel变成了@duanjiefei/babel。

第四步:再次发布

npm publish

执行结果:

在这里插入图片描述
原因:

npm publish 命令执行,默认是进行私有发布,参见官网publish命令
上一篇文章最后提到过scoped的包私有发布时需要收费

解决:如果不想花钱,那只能将包面向公共发布,这也符合npm鼓励开源的精神,这一点和GitHub创建仓库类似。

第五步:公共发布

npm publish --access public

执行结果:

值得注意的一点:我们的项目名是babel,最终发布的包名是@duanjiefei/babel,可见发布的包名可以和项目名不一致,包名取决于package.json中的name字段。

第六步:去npm官网搜索

在这里插入图片描述
至此,我们完成了npm包发布的全部过程,一个unscoped包:djf-test-pkg,另一个scoped包:@duanjiefei/babel,也包括过程中可能遇到的问题。发布完我们自己的包之后,我们会在下一篇文章《npm发布包教程(三):安装发布包》中介绍安装自己的包和涉及到的一些引用模块相关的知识,以及后续文章中介绍如何对发布过的包进行升级和废弃等。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值