百摩网
当前位置: 首页 生活百科

npm和yarn是干什么用的(yarnlink是如何帮助开发者对)

时间:2023-08-08 作者: 小编 阅读量: 1 栏目名: 生活百科

yarnlink是如何帮助开发者对大家好,我是前端西瓜哥最近在研究React源码,用到了yarnlink命令来链接两个项目我对其底层原理产生了兴趣,所以写了这么一篇文章,希望能够通过故事的形式,来让大家理解yarnlink的使用场景和。

npm和yarn是干什么用的?大家好,我是前端西瓜哥最近在研究 React 源码,用到了 yarn link 命令来链接两个项目,接下来我们就来聊聊关于npm和yarn是干什么用的?以下内容大家不妨参考一二希望能帮到您!

npm和yarn是干什么用的

大家好,我是前端西瓜哥。最近在研究 React 源码,用到了 yarn link 命令来链接两个项目。

我对其底层原理产生了兴趣,所以写了这么一篇文章,希望能够通过故事的形式,来让大家理解 yarn link 的使用场景和用法。

另外 npm link 和 yarn link 的效果是相同的,下文就不提及 npm link 了。

有一天,小瓜维护的一个名为 xigua 的 NPM 包,被人提了 issue。小瓜看了下问题描述,凭着对项目的熟悉,他大概知道是哪里出了问题。

为了测试,小瓜搭建了一个 demo-project 项目,且这个项目通过 yarn add xiga 安装了这个包,并在代码中使用了它。

└── demo-project└── node_modules├── apple└── xigua├── old.js└── package.json

理论上,小瓜去这个 demo-project 项目的 node_module/xigua 目录下直接修改代码就好了。

但不幸的是,里面的代码是编译出来的,无法直接修改。

小瓜于是跑到了 xigua-project 包的源码项目中,运行了一个可以监听源码修改生成 npm 包内容的命令。小瓜修改了一处代码,然后自动编译到了 xigua-project/build/ 中。

└── xigua-project└── build└── xigua(编译出来的文件夹)├── fix.js└── package.json

然后小瓜就复制编译好的代码,覆盖掉原来的 demo-project/node_module/xigua ,然后看看效果不对。小瓜发现不对,再改,然后再复制,一连重复了好几次。

“我受不了了,得想个办法。”小瓜说。每次编译完都要手动进行复制操作,太搞人心态了

机智的小瓜一番思考,最终想到了一个办法。

  1. 将 demo-project 下的 xigua 依赖包删除
  2. 然后创建一个 xigua 软链接文件,链接到 xigua-project 下的编译文件夹(软链接可以理解为快捷方式文件,可以将文件位置重定向)

├── demo-project│ └── node_modules│├── apple│└── xigua(重定向) -> /xigua/build/node_modules/xigua└── xigua-project└── build└── xigua(被链接的位置)├── fix.js└── package.json

利用软链接,我们将两个项目关联了起来

yarn link

此时,舍友小润抱着他的猹路过了,猹是他的猫的名字。

小瓜正对自己的奇思妙想沾沾自喜,立马向小润吹嘘起来。

小润:“这个需求,包管理器是有相关命令支持的。”

小瓜:“居然有!展开说说怎么用。”

小润于是讲解了起来。

其实很简单,我们进入到 xigua/build/xigua 目录下,执行 yarn link

$yarnlinkyarnlinkv1.22.17successRegistered"xigua".infoYoucannowrun`yarnlink"xigua"`intheprojectswhereyouwanttousethispackageanditwillbeusedinstead.✨Donein0.01s.

这样,包管理工具就会 在全局注册一个名为 xiuga 的链接。

具体就是创建一个 xigua 软链接文件,指向这个 xigua 目录。在 macOS 中,是在 ~/.config/yarn/link/xigua 目录下。

链接指向如下:

~/.config/yarn/link/xigua->/xigua-project/build/xigua

更准确来说,yarn link 是会从当前工作目录往上找第一个有正确 package.json 文件的目录,作为链接的对象,因为 npm 包里必须要有 package.json。

接下来我们再跑到 demo-project 项目的目录下,执行 yarn link xigua。

$yarnlinkxiguayarnlinkv1.22.17successUsinglinkedpackagefor"xigua".✨Donein0.01s.

它会做两个操作:

  1. 将 demo-project 下的 xigua 依赖包删除
  2. 然后创建一个 xigua 软链接文件,链接到 yarn/link/xigua。形成 demo-project -> yarn/link -> xigua-project 的链。

小瓜震惊了:“这操作不就和我的做法一样吗?不过多了一个 中间人 yarn

是的,但 yarn 更方便。

yarn unlink

你在 demo-project 测试完了,想要断开链接,此时需要执行:

$yarnunlinkxiguayarnunlinkv1.22.17successRemovedlinkedpackage"xigua".infoYouwillneedtorun`yarninstall--force`tore-installthepackagethatwaslinked.✨Donein0.01s.

断开链接后,因为原来的包删掉并换了个链接文件,所以我们需要再把这个包装回来,需要执行 yarn install --force。

你说我删除 node_modules,然后再执行 yarn 行不行。

可以,前提是你的 node_modules 没有其他包的链接,否则的话会把其他包的链接也干掉。

如果要删除全局的注册的名为 xigua 的 link,需要进入到被链接的目录下,执行 yarn unlink

$yarnunlinkyarnunlinkv1.22.17successUnregistered"xigua".infoYoucannowrun`yarnunlink"xigua"`intheprojectswhereyounolongerwanttousethispackage.✨Donein0.01s.

结尾

yarn link 的作用是帮助我们调试开发的 NPM 包。

因为普通项目的依赖包安装是从网络下载安装的,如果要使用本地编译的 NPM 包,比较好的方式是删掉依赖包,通过快捷方式来链接我们本地编译包。

为了简化这一流程,yarn link 出现了,通过中间者的形式,来实现快速地 link 和 unlink。

    推荐阅读
  • 小天鹅滚筒洗衣机不脱水是什么原因(小天鹅滚筒洗衣机不脱水是什么原因导致的)

    如果其损坏脱水就不会动作;3、排水系统堵塞:盛水筒内的洗涤液不能排出,或者盛水筒内泡沫过多,筒内的洗涤液一时难以排净,水位开关不能复位,洗衣机不能进入脱水程序;4、水位开关不能复位:洗衣机脱水程序是在洗涤液排净后,水位开关复位的条件下开始的;

  • 新生儿吃完奶打嗝的处理方法(新生儿吃完奶打嗝怎么办)

    新生儿吃完奶打嗝的处理方法婴儿吃奶太急或太多会出现打嗝。婴儿吃奶的时候,妈妈可用手适当的捏住奶头,控制乳汁的排出,以免宝宝吃奶过急,也不要一次吃的过多。不要在婴儿过度饥饿或哭得很凶时喂奶。喂奶时让宝宝含住整个奶头,尤其是用奶瓶喂养的宝宝,更应注意。婴儿受凉会出现打嗝。天气寒冷时注意给婴儿保暖,避免身体着凉。待小宝贝发出哭声后,打嗝的现象就会自然消失。

  • 最贵的鬃狮蜥长什么样(我老牛可不是吃素的)

    食肉牛龙化石骨架根据对这具化石研究,古生物学家发现这具化石颅骨完全不同于之前发现的任何一种恐龙,食肉牛龙的头部较短较厚,非常像牛头,这也是食肉牛龙名字的由来,也称之为牛龙。根据这具唯一的骨架来看,食肉牛龙体长8米,臀高3米,体重3吨。根据化石复原测算,牛龙的奔跑速度可以达到每小时60公里,可能是白垩纪甚至整个中生代速度最快的食肉动物,所以,“白垩纪猎豹”的头衔,食肉牛龙实至名归。

  • 灭蚊液开一晚上对人体有害吗(灭蚊液开一晚上对人体有没有害)

    灭蚊液开一晚上对人体有害吗蚊香液可以用一晚上,但时长不要超过8小时。避免在狭小、通风条件较差的室内使用,使用时注意通风,一次使用不超过8个小时。使用时注意合理摆放位置,远离床头、易燃易爆物品,远离火种和热源,注意防火。每次使用完毕,加热器冷却后,应妥善收藏,避免掉落及受剧烈冲击,影响或损坏内部零件。长期存放前,应使用软布或纸巾轻轻擦净表面灰尘及污斑,存放于干燥、通风处,避免热源及阳光直射。

  • 驾驶证怎么转(驾驶证怎么转到居住地)

    驾驶员因工作变化或其它原因,发生户口迁移时,其隶属的车辆管理机关也发生变化,驾驶员的档案也要随驾驶员一起转移到新隶属的车管所,成为转籍。同时收回原驾驶证,按变动后的情况换发新证。如要提交体检单,体检收费一般是10元。

  • 年月日怎么写正确(年月日表示法)

    年、月、日表示法1.世纪可以用定冠词加序数词加世纪century表示,也可以用定冠词加百位进数加's表示,我来为大家科普一下关于年月日怎么写正确?intheyeartwofifty-threeB.C.在公元前253年但是,通常采用in加表示年份的阿拉伯数字。为了简便起见,月份与日期连用时,月份常用缩写形式表示。表示通常情况下morning,afternoon,evening等词前用介词in。但是,当这些词前后有一修饰限定的词作为定语,把它们限定为某一天早晨、下午或晚上时,介词in应改为on。

  • 豆角酸甜萝卜的腌制方法(酸甜豆角萝卜的腌制方法)

    豆角酸甜萝卜的腌制方法准备材料:白萝卜一根、豆角200克、白糖、白醋、盐各适量。豆角洗净切成小段备用。盆中放入切好的豆角和萝卜条,然后加入少许盐,拌匀,放置20到30分钟左右,这个过程可去掉萝卜的生涩味。20分钟后豆角萝卜已变软,被盐逼出好多水份,把水倒掉。最后加入白糖和白醋调味没过豆角萝卜。糖和醋可多放,具体要看自己的口味了。密封放置阴凉处5天左右即可食用,酸甜爽口的豆角萝卜就做好了。

  • 新鲜的螃蟹一般怎么来保存(螃蟹买多吃不完怎么保存)

    像小丁这样爱吃螃蟹的人来说,在螃蟹最便宜的时候,怎么会不多买点回家保存起来慢慢吃呢?接下来小丁就给小伙伴们分享如何保存螃蟹的小技巧,但是由于海蟹与河蟹在其生长的环境不同,因此保存的方法也是不同的。感兴趣的小伙伴们不妨跟着小丁一起来学习吧!尤其是雪蟹,这一种基本上捕捞上来就很快的死亡。因此,一旦河蟹死亡,立刻就会繁殖大量的细菌,有的还会产生对我们人体有害的毒素。

  • 五香肉焖饭怎么做(做五香肉焖饭流程)

    五香肉焖饭怎么做八角1个、料酒3勺、葱、姜、蒜适量、盐适量、老抽3勺、食用油适量、蚝油适量、胡萝卜1根、玉米适量、香菇4颗、五花肉适量、豆角适量。锅烧热放油,放入八角葱姜蒜爆香,放入猪肉丁煸炒变色放入生抽调色放蚝油料酒爆炒放入香菇,待猪肉煸炒出油后依次加入剩下的食材加盐翻炒后添热水放入适量盐,水淹没菜焖煮三分钟关火。