项目中经常使用到第三方插件，例如moment.js、lodash.js等，在项目中直接运行yarn add命令安装插件，知其然不知其所以然，今天对照着官方文档在我的好朋友有道翻译的帮助下研究了一下npm发包，感觉发现了新大陆
1、首先先说一下npm源管理
因为我的项目之前使用的npm源设置了淘宝镜像，所以开始使用的时候报错，npm发包需要使用npm的源镜像
1、查看npm源：npm config get registry
2、镜像切换：
淘宝镜像：npm config set registry https://registry.npm.taobao.org
npm镜像：npm config set registry https://registry.npmjs.org
3、临时使用淘宝镜像：npm --registry https://registry.npm.taobao.org install lodash
在npm发包之前需要把镜像切换到npm镜像，执行npm config set registry https://registry.npmjs.org
2、注册npm账号
到官网注册一个npm账号，记住用户名，密码和邮箱，注册之后需要在邮箱中验证一下才能使用
3、创建一个npm包
在本地创建一个文件夹，使用npm创建一个包，执行npm init -y,生成一个package.json文件，文件夹的名字随意起，但是最好与package.json中的那么名字相同
{
"name": "thousand_separator_number",
"version": "2.1.2",
"description": "this is a func to add thousandseparator on a number",
"keywords": ["test","npm"],
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "liuhao",
"license": "ISC"
}
name:这个就是你npm包的名字，就是你最后使用yarn add packageName中的packageName的名字
version：版本号，新建的版本号应该是1.0.0
description:这个包的介绍可以忽略
main：默认是index.js,这个是主文件，最后通过import thousandSeparator from 'thousand_separator_number'导入的方法就是index.js中导出的方法，导入导出遵循Common.js规范
其余的没啥用就不一一介绍了，感兴趣的朋友可以自行百度
4、写自己的项目
我的项目是测试用的，所以项目只用一个主文件index.js
index中写的是一个给数字添加千位符的功能
function thousandSeparator(number){
var isLegal = (typeof number === "string" || typeof number === "number")&&(!isNaN(number))
if(isLegal){
return Number(number).toLocaleString("zh-cn")
}else{
console.log("非数值型无法添加千位符")
return "not a number"
}
}
module.exports = thousandSeparator
一切准备就绪就可以到发包环节了
5、登录npm
执行npm login，输入用户名、密码和邮箱
6、发包
执行npm publish,发包成功之后会显示如下信息
7、修改包
同一个版本号不能反复发布两次，所以每次修改后发版前都要修改版本号，修改方法是执行npm version patch,npm version major,npm version minor,三者的区别是修改的版本号不同，以1.0.0为例，执行三者后的效果
npm version patch：1.0.0会变成1.0.1
npm version major：1.0.0会变成2.0.0
npm version minor：1.0.0会变成1.1.0
修改完版本号就可以执行npm publish重新发包了
8、删除包
npm deprecate <package-name>@<version> ""
8、添加README.md
该文件可以对你的插件进行相应的介绍，遵循Markdown语法，详细说明可以看官方文档
>这是一个npm测试包，第一次体验npm发包
# yarn add
`yarn add thousand_separator_number`
## USE
`import thoud from 'thousand_separator_number'`
##### others
\```javascript
console.log(thousand_separator_number(123456))
\```
以上readme.md文件的代码会显示成如下内容
网友评论