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

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

文章图片

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