技能之发布自己的依赖到npm上

目录

开始

解决

步骤一:

步骤二:

步骤三:

运用


一直以为自己的项目在github上有了(之传了github)就可以进行npm install下载,有没有和我一样萌萌的同学。没事,萌萌乎乎的不犯罪。

偶然的机会,我突然想到,自己的依赖能不能下载?于是,对于自己的新篇章开始了!!

开始

bash 复制代码
npm install mini-zrender
    • mini-zrender是我自己的项目,是通过解读zrender后的产物,目前已经打包好存在于github上一段时间了 - -

发现报错,根本没有这玩意(这什么玩意,作者上传了吗???)

原因:npm官网压根没这个依赖(是的,一直只知道使用,不知其根本,好尴尬)
npm官网找了一圈,压根搜不到~

那么如何才能达到我们的目的呢?

解决

步骤一:

npm官网上去注册一下(这里截图我就不截了),这是先决条件。

步骤二:

终端执行

tips:这里需要将镜像置回原先的registry.npmjs.org(如果不是这个镜像的话)

bash 复制代码
npm login

莫名其妙的错误:出现这种错误一定要看看设置对不对,因为我搜了半天最后发现是协议问题,http改成https就好了~~(经验--出现这种错误基本是自己的code或者配置有问题,重头看看!!!)

https://registry.npmjs.org/

这个问题是一次性密码设置:

设置2FA

下载App:这里直接推荐Microsoft Authenticator,支持Android和iOS

将这么长一串复制到Enter one-time password from your authenticator app:就可以登录成功了

步骤三:

执行npm publish(每次发布的时候package.json 里面的 version不能一样,不然不能发布出去,手动改下版本就行),如果没报错在自己的Packages中就能搜到了

OK,根本原因解决了。然后我们来看看使用方面有没有问题!!!

运用

来看看在实际工程中如何运用,我这边直接通过vite脚手架创建了一个新工程,然后把zrender和mini-zrender都install进我的工程里面

先顺利的把它install进我们自己的工程(说明前面的publish生效了,能找到这个依赖)

不需要花里胡哨的,直接在App.vue暴力使用,高效的看到效果。

贝塞尔曲线的效果展示出来了,说明我们这一套流程下来就形成闭合了。站在不同的角度,我们的眼界和思维方式都会不一样,之前从未尝试发布过依赖包,如今这个新世界感觉还是挺友善的。

至于mini-render的代码怎么写的,为什么可以实现这样的贝塞尔曲线。可以参考我的专栏文章

你真的了解Canvas吗--解密一【ZRender篇】这篇可以试读。

你真的了解Canvas吗--解密xx【ZRender篇】系列的文章

如今已经更新到第十四篇了,里面深刻解读zrender的工作原理,感兴趣的小伙伴可以去看看。


好了,今天的分享就到这里。

如果觉得有收获,麻烦给个赞和关注。你的鼓励是我写作的动力,大家一起学习一起进步。

相关推荐
怕浪猫3 分钟前
第一章、Chrome DevTools Protocol (CDP) 详解
前端·javascript·chrome
kyriewen19 分钟前
从本地到生产:迁移到 GitHub Actions 自动化 CI/CD,总结了这 5 个坑
前端·github·自动化运维
雨季mo浅忆32 分钟前
首个Vue3项目边写边学边记
前端·vue3
IT_陈寒2 小时前
React中useEffect依赖项这个坑我居然踩了三天
前端·人工智能·后端
qq4356947012 小时前
Vue04
前端·vue.js
我是真菜3 小时前
彻底理解js中的深浅拷贝
前端·javascript
江畔柳前堤3 小时前
github实战指南07-CLI 与高级技巧
前端·人工智能·chrome·深度学习·github·caffe·issue
weixin_571667413 小时前
[解决] Node.js 安装后 命令找不到
node.js
kisdiem4 小时前
ReAct:让大模型一边推理,一边行动
前端·react.js·前端框架
西部荒野子4 小时前
JS 如何跑进两个原生世界
前端