• 首页 首页 icon
  • 工具库 工具库 icon
    • IP查询 IP查询 icon
  • 内容库 内容库 icon
    • 快讯库 快讯库 icon
    • 精品库 精品库 icon
    • 问答库 问答库 icon
  • 更多 更多 icon
    • 服务条款 服务条款 icon

NPM库的发布——诚意奉献,讲透

武飞扬头像
搬砖的乔布梭
帮助1

@注册NPM账号

学新通

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

学新通

  • 注册成功,进入个人主页

学新通

@从身份验证器App获取OTP

安装验证器APP

  • 手机应用市场搜索微软验证器(Microsoft Authenticator)或谷歌验证器(Google Authenticator),无情下载安装之!

学新通

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

链接:pan.百度.com/s/19vzSSeYN… 提取码:xra5

向验证器中添加NPM账号

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

学新通

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

学新通

学新通

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

学新通

从验证器实时获取OTP

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

学新通

@发布一个NPM包

终端登录NPM

  • 切换到NPM官方源
# 全局安装nrm
npm i -g nrm

# 切换NPM源到NPM官方源
nrm use npm
  • 在本机添加自己的NPM账号
# 添加刚刚注册的NPM账号 后续依然要输入OTP 从APP获取即可
npm adduser
  • 登入、登出、账号切换
# 查看当前登录的账号
npm whoami

# 登出当前账号
npm logout

# 登录新账号
npm login

发布NPM库

  • 创建一个NPM项目,例如 h5-wheels
# 进入项目根目录
cd h5-wheels

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

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

# 此处笔者使用选项二 ↑↑↑ 👹
  • package.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

业务逻辑胡乱撸之

/* 返回[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模块导出之

module.exports = {
    getRandom,
    getRandomItem,
}
  • and finally —— 无情发布之!
# 要切换到NPM官方源并 npm login 在先哦~ 😊😊😊
npm publish --access=public

取消发布

  • 类似于删库跑路,不再维护
npm unpublish <您的包名> --force
  • 此时在 npmjs.com 中登录,会发现自己的 packages 中已经不存在这个包了!

小总结

  • 本例只是一个简单的例子
  • 使用的是CommonJS/CJS模块规范
  • 前端通常使用的模块化规范是ESM,将在后续的教程中更新
  • 本例通过非常的通俗的手法,让各位看官知道:
  • 所谓NPM的发布与安装,不过就是把一包代码暂存于NPM然后用户下载到node_modules中使用罢了...

学新通

@使用自己发布的NPM包

安装自己发布的包

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

npm i @steveouyang/h5-wheels

无情使用之

// 引入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]));

控制台正确输出结果,骗人是小狗!

学新通

学新通

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

@依赖的版本更新

检查所有依赖的新版本

npm outdated

下图的仓库有更新了! 学新通

更新所有包

npm update

更新指定的包

npm update xxx

锁定主版本号

  • 我们看到的大多数库的版本是下面这样写的 ↓↓↓
"xxx":"^1.0.0"
  • ^ 代表锁死主版本
  • 即xxx库的更新范围为 1.x.x
  • 当次版本和补丁有更新时,npm update 会触发xxx的更新
  • 但xxx永远不会升级到2.0.0 —— 因为可能带来不兼容!!😱😱😱

同时锁死主次版本号

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

可是,为什么我得到你的人,却得不到你的心??

学新通

这篇好文章是转载于:学新通技术网

  • 版权申明: 本站部分内容来自互联网,仅供学习及演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,请提供相关证据及您的身份证明,我们将在收到邮件后48小时内删除。
  • 本站站名: 学新通技术网
  • 本文地址: /boutique/detail/tanhgajffj
系列文章
更多 icon
同类精品
更多 icon
继续加载