当前位置: 首页 > 科技观察

图文结合简单易学的npm包发布流程

时间:2023-03-13 21:28:55 科技观察

聪明的你,在做了几个项目之后,有没有发现一些工具、方法或者组件被频繁使用,很多项目都在使用。如何更优雅地复用这些工具、方法或组件,而不是在使用时复制粘贴?打包为npm包是一个不错的选择。本文以图文结合的方式介绍如何从0到1发布一个npm包。文章中对一些关键点的解释,将帮助你避免陷阱,提高效率。欢迎阅读学习~1.代码准备每个人都有不同类型的npm包要发布,包括UI组件库、工具函数库、使用的插件等。我要发布的npm包是一个由项目中常用的工具函数组成的工具函数库。构建工具使用rollup,代码托管在github上。下面简单介绍几个要点:首先,在github上新建一个仓库。创建新仓库时,license选择MIT。如果不选择这一步也没关系,以后可以添加license。但是您必须拥有发布npm包的许可证。将代码拉取到本地初始化项目,安装依赖等完善的功能打包,并在package.json中指定入口另外,如果发布公共包,需要在package.json“publishConfig”中添加publishConfig的配置:{"access":"public"},复制代码更多项目建设和一些配置方面的信息,建议阅读文末参考资料。2、账号注册先看下图了解注册流程:网址:www.npmjs.com/signup[2]输入网址后,会进行安全检查,然后界面如下:点击“我是人》进行图片验证,如下图:图片验证完成后,就是输入用户名、密码、邮箱的过程,最后让输入一次性密码,这一次-时间密码(相当于验证码)将发送至您预留的邮箱。填写完毕后,注册应该就成功了。3、发布npm包3.1登录npm账号3.1.1登录失败执行npmlogin命令登录npm:如上图,登录失败。解决方法:使用nrm切换镜像,将镜像改为npm。下面简单介绍一下nrm。3.1.2nrm简介nrm用于管理镜像,是一个可以切换npm镜像的管理工具。下面是安装命令,查看是否安装成功:npmi-gnrmnrm-V常用的复制代码的nrm命令如下:关于nrm[3]的更多信息,请参考DocumentationandInformation[4].下图是使用nrmls命令查看镜像:下图是将镜像切换到npm3.1.3,登录成功后切换镜像再登录:如上图所示,需要登录时输入动态密码,需要查看邮箱。输入OTP并回车后,即可成功登录。3.2如何发布npm包3.2.1首次发布成功后,可以执行发布命令:npmpublish,如下图所示:此时npm包发布成功。3.2.2类似名字发布失败,但是感觉'mxdevutil'这个名字可读性不是很好,所以改了名字,用新名字'mx-dev-util'重新发布,但是报错,如图如下图所示:图中的错误信息告诉我们:新包的名字和已有包的名字很相似,所以没有发布成功。解决办法之一是使用一个更有特色的名称,但最好删除并重新发布。3.3如何删除npm包3.3.1放弃npm包以下命令可以删除错误发布的npm包:但实际上这个命令是丢弃发布的npm包,而不是删除它。被遗弃的npm包在npm网站上依然可以找到,如下图:被遗弃后能否发布成功?重新执行npmpublish执行结果如下图:还是报错,所以简单的丢弃原包是无法发布新包的。3.3.2删除npm包的正确解决方法是:npmunpublish\-force命令执行效果:在npm网站上搜索,是找不到的:删除发布的包后,可以终于重新发布了:发布成功!在npm官网也可以看到新的包:3.4npm包的使用方法首先安装我们发布的npm包,执行命令npmimx-dev-util,如下图:可以查看package.json文件,返现已经mx-dev-util添加为依赖:接下来使用项目中npm包提供的方法:3.5更新npm包版本分两步更新npm包:第一步:执行npmversion第二步:执行npmpublish3.5.1npm版本介绍npmversion命令的用法如下:npmversionmajor|未成年人|补丁|预科|初级|预补丁|版本字段,结构为“x.y.z”,即三位版本号。分别对应版本中的major、minor、patch。如果当前版本为0.0.1,则发布major和minor,补丁版本分别为1.0.0、0.1.0、0.0.2。图谱总结如下:更多信息请参考npm版本文档及相关资料[5]。理解npmversion命令后,执行npmversionmajor:命令执行失败,提示需要先提交代码。代码提交流程如下图所示:提交代码后执行版本更新命令:3.5.2修改后发布提示版本已更新为2.0.0版本,然后执行npmpublish命令:可以看到版本更新成功。下面总结一下用于发布npm包的npm命令4.总结(1)本文介绍了发布npm包的三个关键环节:发布内容。即代码,是npm包注册npm账号的基础。这是成功执行npmrelease命令npmpackagerelease的前提。掌握npm包发布的命令是关键(二)本文介绍如何使用nrm切换npm镜像。希望这篇文章对您有所帮助。表述不清楚或有误欢迎指正~