使用NPM发布uni-app,Vue自定义组件

使用NPM发布uni-app以及vue自定义组件

使用npm install 安装他人发布的组件平时用的比较多，操作也比较简单。最近自己捣鼓了一下，如何发布自己的自定义组件方便自己和他人使用npm install 安装。

编写组件

第一步是本地编写自己的自定义组件，编译通过并确保组件能正常运行的情况下就可以通过npm publish 发布了。不过发布之前还需要一些准备工作。

注册NPM账号

首先需要注册npm账号并绑定邮箱，最好绑定QQ邮箱，其他邮箱验证的时候容易出现错误。npm注册链接NPM注册

npm init

注册完成之后，配置好package.json文件就可以通过npm发布了。不过如果是自己通过HBuiderX开发工具新建的项目是没有package.json文件的。因此需要使用命令行工具打开文件所在的目录并执行npm init 命令，该指令会在当前目录下创建package.json文件。根据实际情况输入相关信息即可。当然也可以一路回车然后自己进到文件里面修改

npm login

配置好package.json文件之后就可以通过npm发布了。这时候在此使用命令行窗口打开文件所在目录执行npm login 指令
，可能会比较慢，需要耐心等待。输入Username : Password： Email等

该信息就是我们注册NPM账号时的信息，需要注意在输入密码的时候，光标不会移动，输入的字符也不会显示。单这时正常的，正确输入你设置的密码按回车就好出现Logged … 则说明登录成功

npm publish

登录成功之后 继续执行npm publish指令，即可完成自定义组件的发布，如果发布的组件和他人已经发布的组件同名会导致发布失败，需要我们更改组件名，然后再次发布。
该组件我之前已经发布过故现在发布不成功，发布成功后可以上到NPM账号里面发现，已经有一个包发布成功了。

npm install 试试发布的组件

组件发布之后可能需要过段时间才能通过 npm install 安装。使用命令窗口打开文件目录然后运行npm install gmy-fuzzy-search
安装结束后发现文件目录下多了一个node_modules文件夹，点开里面就是我刚才发布的自定义组件内容

写在后面的话

到这里npm发布自定义组件就已经完成了，有几个地方需要注意

1. 注册npm账号最好绑定QQ邮箱，我之前使用foxmail和新浪邮箱都没有绑定成功，直到换了QQ邮箱
2. 如果不是通过ｎｐｍ构建的项目是没有ｐａｃｋａｇｅ．ｊｓｏｎ文件的，因此需要通过ｎｐｍ　ｉｎｉｔ　创建
3. 使用ｎｐｍ　ｌｏｇｉｎ　时输入密码时没有任何提示的，但这不是错误，正常输入密码敲回车即可
4. 组件重名则无法发布需要更改自己的组件名。
   ——————————————————ｔｈｅ　　ｅｎｄ　——————————————————————————