NPM库的发布——诚意奉献，一文讲透

@注册NPM账号

NPM官网
按步骤开始注册账号

过程中需要输入一个一次性密码（OneTimePassword/OTP）
首次时从注册邮箱中翻出这个OTP

注册成功，进入个人主页

@从身份验证器App获取OTP

安装验证器APP

手机应用市场搜索微软验证器（Microsoft Authenticator）或谷歌验证器（Google Authenticator），无情下载安装之！

PS：写到此处时笔者思考了一下人生，决定还是给乃们一个谷歌验证器的云盘地址吧... 👺👺👺

链接：pan.baidu.com/s/19vzSSeYN... 提取码：xra5

向验证器中添加NPM账号

添加账号：在APP首页加号按钮，新增账户
后续过程有添通过加二维码这个选项
在NPM网站中获取这个二维码

选择生成校验器APP的二维码

在校验器扫描这个二维码，就可以源源不断地获取NPM的OTP了，大约每5秒就会刷新一次

从验证器实时获取OTP

每次登录时直接从APP中获取OTP就可以了

@发布一个NPM包

终端登录NPM

切换到NPM官方源

shell 复制代码

# 全局安装nrm
npm i -g nrm

# 切换NPM源到NPM官方源
nrm use npm

在本机添加自己的NPM账号

shell 复制代码

# 添加刚刚注册的NPM账号 后续依然要输入OTP 从APP获取即可
npm adduser

登入、登出、账号切换

shell 复制代码

# 查看当前登录的账号
npm whoami

# 登出当前账号
npm logout

# 登录新账号
npm login

发布NPM库

创建一个NPM项目，例如 h5-wheels

shell 复制代码

# 进入项目根目录
cd h5-wheels

# 初始化项目选项一（将来npm install h5-wheels）
npm init -y

# 初始化项目选项二（将来npm install @<你的NPM用户名>/fe-wheels）
npm init --scope=<你的NPM用户名>

# 此处笔者使用选项二 ↑↑↑ 👹

package.json大致如下

json 复制代码

{
  // 包名
  "name": "@steveouyang/h5-wheels",

  // 当前版本（可升可降，通常不建议降，会让用户形成黑人问号脸）
  "version": "0.2.4",

  // 库的描述，可以写那啥一点
  "description": "一些零零碎碎的JS小函数合集没啥卵用不建议安装 / awesome JS function craps which are TOTALLY useless and STRONGLY RECOMMEND that u dont install this shit!",
  
  // 入口文件
  "main": "main.js",

  // 一些快捷脚本（不是必须）
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "gpush":"git add . && git commit -m 首次提交/还原点 && git push -u origin master"
  },

  // Git仓库地址
  "repository": {
    "type": "git",
    "url": "https://gitee.com/steveouyang/h5-wheel.git"
  },

  // 作者
  "author": "steveouyang",

  // 开源证书，此处使用的是默认的ISC证书
  "license": "ISC"
}

写点代码，使用CJS模块风格导出

h5-wheels/data_utils/math_util.js

业务逻辑胡乱撸之

js 复制代码

/* 返回[start,end]之间的随机整数 */
function getRangeRandom(start, end) {
    return start + Math.round((end - start) * Math.random());
}

/* 从arr或字符串中随机摘取一个元素 */
function getRandomItem(arr) {
    return arr[getRandom(0, arr.length - 1)];
}

CJS模块导出之

js 复制代码

module.exports = {
    getRandom,
    getRandomItem,
}

and finally ------ 无情发布之！

shell 复制代码

# 要切换到NPM官方源并 npm login 在先哦~ 😊😊😊
npm publish --access=public

取消发布

类似于删库跑路，不再维护

shell 复制代码

npm unpublish <您的包名> --force

此时在 npmjs.com 中登录，会发现自己的 packages 中已经不存在这个包了!

小总结

本例只是一个简单的例子

使用的是CommonJS/CJS模块规范

前端通常使用的模块化规范是ESM，将在后续的教程中更新

本例通过非常的通俗的手法，让各位看官知道：

所谓NPM的发布与安装，不过就是把一包代码暂存于NPM然后用户下载到node_modules中使用罢了...

@使用自己发布的NPM包

安装自己发布的包

js 复制代码

# npm i <您的包名>
# 要切换到NPM官方先哦~ 😊😊😊

npm i @steveouyang/h5-wheels

无情使用之

js 复制代码

// 引入node_modules中的代码
const { getRandom, getRandomItem } = require("@steveouyang/h5-wheels/data_utils/math_util")

// 无情调用之
console.log(getRandom(1, 10));
console.log(getRandomItem([3, 1, 4, 1, 5, 9, 2, 6]));

控制台正确输出结果，骗人是小狗！

↑ 这是一种怎样的表情？？欢迎留言区讨论~~~

@依赖的版本更新

检查所有依赖的新版本

shell 复制代码

npm outdated

下图的仓库有更新了！

更新所有包

shell 复制代码

npm update

更新指定的包

shell 复制代码

npm update xxx

锁定主版本号

我们看到的大多数库的版本是下面这样写的 ↓↓↓

json 复制代码

"xxx":"^1.0.0"

^ 代表锁死主版本
即xxx库的更新范围为 1.x.x
当次版本和补丁有更新时，npm update 会触发xxx的更新
但xxx永远不会升级到2.0.0 ------ 因为可能带来不兼容！！😱😱😱

同时锁死主次版本号

json 复制代码

"xxx":"~1.7.0"

这代表版本允许的更新范围为 1.7.x
主次两个版本号同时都被锁死了~
永远不会更新到 1.8.0 或更高!

可是，为什么我得到你的人，却得不到你的心？？