调试以及发布npm组件

开发原因:

由于公司自己的封装到npm的组件有点问题,负责人由在忙其他,就由我去负责改改,中途出了不少问题,记录一下。

一、下载源码

第一步肯定是去git上把组件的源码下载下来,这一步没什么好说,clone下来本地

二、组件调试

第二步就开始有问题了,因为之前没有调试npm组件,不知道如何调试,请教才知道得用到"npm/pnpm link"(我们公司用的是pnpm,后续都直接写pnpm,npm同理)

  1. 首先在组件项目 中,运行一下 pnpm start(father-build),将当前项目打个包,这个打包的话会输出一个es文件夹。

  2. 在组件项目中,运行一下 pnpm link ,这个作用是将这个组件包,注册到自己的电脑的全局依赖目录 (通过 npm root -g 可以查看电脑全局依赖包的目录)

  3. 在需要使用组件项目的的项目目录中,运行 pnpm link <包名>,例如我那个组件名叫test(package.json文件的name),这里就运行pnpm link test. 这样就用本地依赖链接上刚刚注册到全局的依赖了,然后就可以引入使用了。

遇到的问题:
复制代码
 1.如果使用pnpm link 并且项目中也pnpm link 包名了,但是还是没有成功联调上怎么办?
 解:可以试试加上--global ,在注册的时候和链接时的后面都加上--global
  
 2.在上述操作后,依旧没能成功联调
 解:把项目的组件依赖删了,然后重新装一下整个,先pnpm remove <包名> 然后重新install

 3.我在改动组件后,还需要重新link吗?
 解:不需要,link完成后本地包更新全局也会更新,所说只需要pnpm start本地更新一下

三、发布版本

改完代码就需要发布npm包了,上命令

1.更新版本

pacth、minor、major分别对应版本的第三位,第二位和第一位。

例如版本1.2.3

patch对应第三位,运行这个命令后,3就会变成4然后去发布就是1.2.4,等于是一个小版本。

minor对应第二位,运行版本加一就是1.3.3。

major对应第一位,运行后是2.2.3

2.发布

运行完上述命令后,会更新版本号,并且去发布,但是什么都没配置发布的话,会报错未注册。

原因是自己还没在npm上注册账号,发布的话没有自己的信息

2.1.首先得运行命令:pnpm addUser,然后会弹出账号、密码、邮箱让你输入

2.2.然后再pnpm login去登录,登录完成的话就可以重新运行发布命令了。

遇到的问题:
复制代码
 1. 运行pnpm addUser报错 "Web login not supported"
 解:可能原因(1)自己有没有改过npm源,比如改成一些私有源
            (2)pnpm/npm版本问题,你可以试试在命令后加上--auth-type=legacy 

 2. 注册时账号输入完成可是输入密码命令行没反应
 解:这是正常原因,为了隐私不会显示,所以看起来一点反应都没,实际是有输入的,登录同理
 
 3. 因为上述原因,运行了好几次命令,版本号加了好几次怎么办
 解:可以通过npm unpublish命令取消发布,就不会加版本号了

四、项目更新组件

剩下的就是更新项目内的组件版本了,重新install一下要更新的包,就完成了

相关推荐
涛涛ing5 分钟前
模型吐出半截JSON,前端如何边收边渲染?2026年AI应用必须闯过的工程关
前端
aixingpan7 分钟前
aixingpan.cnAPI开发文档:api_docs_trichart_natal_solar_return_transit2接口指南
前端·php
FRing0323 分钟前
JavaScript入门到精通二十八(forEach遍历、创建对象的三种方式、构造函数、new实例化执行过程、实例成员和静态成员)
开发语言·前端·javascript
燕落南枝37 分钟前
CSS 表单选择器与伪元素选择器详解
前端·css
拖孩38 分钟前
一个人 + AI 做的小程序,今天,正式回本了
前端·后端·微信小程序
进击的丸子44 分钟前
APP 人脸识别增值版 SDK:Camera2 无缝接入指南
前端·前端框架·代码规范
进击的丸子1 小时前
代理网络环境下 Linux Pro 在线激活实操指南
javascript·后端·安全
开开心心就好1 小时前
本地文件搜索工具,双击Ctrl就能呼出搜索
java·服务器·前端·支持向量机·ffmpeg·音视频·模拟退火算法
知了清语1 小时前
SVG 缩放预览:F12 无法定位子元素 & 放大模糊
前端
AN1 小时前
一个人,带着一群 AI:一个 10 年前端如何做出几十个团队在用的在线文档
前端