[TOC]
* * * * *
### **一、npm官网注册**
想要上传我们的npm包，我们首先要有一个npm账号。可以去[官网注册](https://www.npmjs.com)，具体注册过程不在说明
### **二、编写一个最简单的插件（包）**
我们编写一个方法将手机号中间的四位数用 ` * `表示
**1. 创建一个 `myself-test-package` 文件夹**
```JavaScript
mkdir myself-test-package
```
**2. 在`myself-test-package`文件夹中新建一个 index.js 文件 并随意写入方法。这里的index.js 文件是入口文件要和`package.json` 文件中 `main` 字段的配置相同**
```JavaScript
exports.phone = function(phoneNumber){
return phoneNumber.toString().replace(/^(\d{3})(\d{4})(\d{4})/,"$1****$2")
}
```
**3. 在文件夹中使用npm初始化，生成package.json**
```JavaScript
npm init
```
初始化时我们会生成一个`package.json` 文件
```JavaScript
{
"name": "myself-test-package",
"version": "1.1.0",
"description": "test",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"repository": {
"type": "git",
"url": "git+https://github.com/webxiaoma/test.git"
},
"keywords": [
"test-myself-webxiaoma"
],
"author": "webxiaoma",
"license": "ISC",
"bugs": {
"url": "https://github.com/webxiaoma/test/issues"
},
"homepage": "https://github.com/webxiaoma/test#readme"
}
```
需要注意的是包的名称必须是唯一的，不然上传不上去。在给包起名字之前可以去npm官网搜索一下是否重名。
如果你的项目也在github仓库中，可以在package.json中填写repository地址，这样可实现自动更新包
### **三、上传包**
我们执行
```JavaScript
npm adduser
```
之后会让我们输入用户名、密码和邮箱，这些东西是你在npm官网注册的账号信息，填写完之后我们在执行
```JavaScript
npm publish
```
我们的包就上传了。
**需要注意**
如果我们使用了淘宝镜像 cnpm 我们是无法上传的。解决方法：
**1. 将npm设置成原仓库，不在使用淘宝镜像**
```JavaScript
// 查看npm是否设置了淘宝镜像
npm config get registry
// 设置会原来的npm地址
npm config set registry=http://registry.npmjs.org
```
完成设置之后重新登录账户进行发布，不过这里如果我们在想使用`cnpm` 还用重新设置淘宝镜像
**2. 也可以使用一些其他辅助工具 例如：[smart-npm](https://github.com/qiu8310/smart-npm/)**
上传后我们就可以正常的使用npm来下载我们的这个包了。
```JavaScript
npm install --save-dev myself-test-package
```
### **四、持续集成**
一般来说你会看到一些项目README.md里面有一些icon如：
这些icon看起来很牛逼，但也不只是装逼用的。
>持续集成(Continuous integration)的目的，就是让产品可以快速迭代，同时还能保持高质量。它的核心措施是，代码集成到主干之前，必须通过自动化测试。只要有一个测试用例失败，就不能集成。
每个icon都表示一个功能，这里不多做介绍，有兴趣可以看看下列文章：
1. [跟踪Github项目的持续集成状态](https://harttle.land/2016/04/30/github-ci.html)
2. [使用travis-ci集成一个vue.js项目](https://yimogit.github.io/2017/07/24/%E4%BD%BF%E7%94%A8travis-ci%E8%87%AA%E5%8A%A8%E9%83%A8%E7%BD%B2github%E4%B8%8A%E7%9A%84%E9%A1%B9%E7%9B%AE/)
参考文章：
[将你的组件发布到npm平台上](https://segmentfault.com/a/1190000012151905)
