作为前端，我们经常在npm上面下载各种各样各路大神的插件，安装至我们的项目中，方便又快捷。下面就简单介绍一下如何将我们自己写的小插件上传至npm，供自己和大家下载使用。
前提需要在自己的电脑下载node.js ,下载完自动会有npm.( 自行下载 )
首先需要在npm官网注册一个账号。（https://www.npmjs.com/signup，自行注册，不多介绍）。
注册完后，使用cmd终端的方式登录 npm login ,如图
登录报错.png
依次输入用户名，密码，邮箱
输入成功后如出现以上报错信息：大概意思是我们吧npm仓库指向成了淘宝镜像库了，这可能是因为我们以前安装了cnpm，我们需要吧设置成npm仓库，解决如下：
cmd执行： npm config set registry=http://registry.npmjs.org 如图：
设置完后.png
设置完成后，使用命令 npm config get registry 查看，成功指向了npm。
以上终端登录完成 接下来开始编码我们需要上传的插件吧！
首先新建一个空文件夹，我这里是myTestPlugin，终端进入当前文件夹，初始化项目 npm init
需要填写的信息依次是：
package name: 包的名称
version: 版本号
description: 包的描述
entry point: 入口文件，默认是index.js
test command: 测试命令，可以不填直接回车
git repository: 提供git个人仓库，可以不填，直接回车
keywords： testplugin (项目的关键词，npm搜索关键词)
author: 作者名称
license: (ISC) 包遵循的开源协议，默认是ISC
init.png
以上填写完毕后会出现刚才填写的项目结构，is this ok ? 是否确定，直接回车即可.
回到自己的文件夹，会多出现一个package.json文件，就是我们刚才填的项目信息，如图:
init.png
此时我们在当前文件夹下面新建一个index.js的入口文件，写上一个简单的方法，如图：
fn.png
此时打开我们的终端，进入当前文件夹，输入命令 npm publish 发布至npm ： 成功后如图：
success.png
然后我们进入npm 官网（https://www.npmjs.com），搜索我们刚刚发布的插件。如图
plugin.png
接下来就是在我们自己的项目里面安装我们的插件：
新建项目，进入该项目cmd,执行 npm install test-plugin-xyp 安装我们的插件，然后引入调用。（我这里是使用node命令执行）如图：
我们的插件也被安装在node_modules文件夹下面了。
如上图，调用成功，出现几个warning警告，是因为项目没有执行 npm init 初始化生成package.json 项目配置文件。因为我是使用node启动程序的。需要的同学可以 npm init。
如果今后我们在插件源码上面新增了功能，发布前需要在源码文件夹的package.json文件下修改下 version 属性值（版本号）,然后在重新执行命令 npm publish ,发布成功后，则可以在npm官网搜到我们的更新版本号相关信息。 然后在我们自己的项目中重新npm install 插件名 ，就可以使用我们新添加的功能啦。
至此，演示完毕。
当然啦，也有发布失败的情况下，下面贴几种常见的失败场景：
1：未登录npm情况下报错，解决方法：先登录。（上文可查看登录方法）
nologin
2：因为仓库指向了淘宝镜像库，需要设置成npm，执行图中绿色线，然后重新登录即可
loginSuccess.png
3:大概意思就是你的插件名在npm上已经被占用啦，进入文件目录下package.json 里面修改 name 属性值
duplicateName.png
4：此报错信息是因为新注册的账号，还未经过验证，需要注册时的邮箱验证，复制链接，并登录后，才算验证完毕，验证后，重新npm publish
unverified.png
网友评论