介绍完整的npm发包流程：创建账号，创建npm包，发布npm包，使用npm包，更新npm包等等
创建 npm 账号
-
在 npm 官网 www.npmjs.com/ 注册并创建 npm 账号
-
注册之后进入新首页 www.npmjs.com/?track=newU… ，有如下提示：
- It looks like you still do not have two-factor authentication(2FA) enabled on your npm account. To enable 2FA, please follow the instructions fount here（看起来您的 npm 帐户仍未启用双因素身份验证 (2FA)。要启用 2FA，请按照此处的说明进行操作）。
- 点击官方英文文档去验证，按照文档操作就行
- 阮一峰 双因素认证（2FA）教程
- 5 款好用的 2FA 两步验证工具推荐
- 总结：认证工具需要科学上网，你懂的，稍微有些麻烦。千万要注意备份，多端通用，不然万一设备出问题了，找不到了，那就麻烦了。所以我暂时先没弄。
- You have not verified yout email address. （您尚未验证您的电子邮件地址）
- 点击这个提示，就会向邮箱发送验证邮件，在邮箱中操作即可
创建 npm 包
先拿一个 utils 工具文件尝试，放入一些常用的工具函数，如手机号校验、金额格式化等
- 新建一个文件夹(shang-utils)
- 进入文件夹，运行 npm init 命令。如下所示，会有一些初始化的配置项，大部分只要按 enter 就行，最后会生成一个 package.json 文件，之后也可以随时改。
- 详细介绍可查看：npm Docs 之 package.json
{
"name": "shang-utils", // 包名，必须要独一无二
"version": "1.0.0", // 版本号
"author": "xxx", // 作者
"description": "common toolkit", // 描述信息
"keywords": ["utils", "format", "money", "phone"], // 关键词，提升SEO
"repository": {
// 代码托管位置
"type": "git",
"url": "https://github.com/xxx/shang-utils"
},
"license": "ISC", // 许可证
"homepage": "https://your-package.org", // 包的主页或者文档首页
"bugs": "https://github.com/xxx/shang-utils/issues", // 用户问题反馈地址
"main": "index.js", // 入口文件
"scripts": {
// 存放可执行脚本
"test": "echo \"Error: no test specified\" && exit 1"
},
"dependencies": {
// 运行依赖
},
"devDependencies": {
// 开发依赖
}
}
- 完成工具函数文件
// a. index.js 入口文件
import Format from "./src/format";
import Validate from "./src/validate";
export { Format, Validate };
// b. format.js 格式化文件
const Validate = {
/**
* 手机号校验
*/
mobileCheck: (value) => /^[1][3,4,5,7,8][0-9]{9}$/.test(value),
/**
* 身份证校验
*/
IDCardCheck: (value) =>
/^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/.test(
value
),
/**
* 邮箱校验
*/
emailCheck: (value) =>
/^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/.test(value),
};
export default Validate;
// c. validate.js 校验文件
// 解决toFixed保留小数的问题
const formatToFixed = (money, decimals = 2) => {
return (
Math.round(
(parseFloat(money) + Number.EPSILON) * Math.pow(10, decimals)
) / Math.pow(10, decimals)
).toFixed(decimals);
}
const Format = {
// 格式化金额展示： 12341234.246 -> $ 12,341,234.25
formatMoney: (money, symbol = "", decimals = 2) =>
formatToFixed(money, decimals)
.replace(/\B(?=(\d{3})+\b)/g, ",")
.replace(/^/, `${symbol}`),
};
export default Format;
npm 包上传 Github
-
Github 上创建新仓库
shang-utils -
按照说明文档，上传项目，并初始化本地分支
git init
git add .
git commit -m "first commit"
git branch -M master
git remote add origin git@github.com:xxx/shang-utils.git
git push -u origin master
npm 包发布
- 检查 npm 源，如果是淘宝源，则需要改回 npm 源
2024.1.22 淘宝原镜像域名（registry.npm.taobao.org）的 HTTPS 证书正式到期，彻底不能用了，具体可以看另一篇文章npm淘宝镜像过期
// 查看npm镜像源地址
npm config get registry
// 切换npm镜像源
// 设置npm默认源
npm config set registry https://registry.npmjs.org/
// 设置npm镜像源为淘宝镜像
// 2024.1.22 淘宝原镜像域名（registry.npm.taobao.org）的 HTTPS 证书正式到期，彻底不能用了
// npm config set registry https://registry.npm.taobao.org/
// 2024.2.29 更新为新的域名地址
npm config set registry https://registry.npmmirror.com
- 在终端中切换到项目目录下，运行登陆命令，之后按照终端提示输入用户名、密码等信息即可
// 登陆
npm login
// 控制台会提示输入相关信息
Log in on https://registry.npmjs.org/
Username: // 用户名
Password: // 密码
Email: (this IS public) // 邮箱
Enter one-time password: // 如果之前做过 双因素身份验证 (2FA)，需要生成一次性密钥
Logged in as xxx on https://registry.npmjs.org/.
- 运行发布命令
// 发布命令
npm publish
我这个工具函数比较简单，一下就发布成功了，没有碰到其他问题。发布成功后，就可以登陆 npm 网站，查看发布包的情况了
npm 包使用
在项目中安装依赖包
npm install shanglv-utils
安装成功后，可以在项目的 node_modules 中看见包文件
使用举例：
// 导出方式
export { Format, Validate };
// 使用方式
import { Format, Validate } from "shanglv-utils";
Format.formatMoney(12341234.246, "$", 2); // $12,341,234.25
Validate.mobileCheck("123456"); // false
更新 npm 包
如下所示：更新了一下说明文档，重新发布
// 自动更改版本号，并且commit
// npm version xxx
// 控制台会返回下一个小版本号 如v1.0.1
npm version patch
// 重新发布
npm publish
// patch：补丁号，修复bug，小变动，如 v1.0.0->v1.0.1
npm version patch
// minor：次版本号，增加新功能，如 v1.0.0->v1.1.0
npm version minor
// major：主版本号，不兼容的修改，如 v1.0.0->v2.0.0
npm version major
