前端小白工作记录之 yarn link

工作之后，发现每天都能学到新的知识，对此感觉工作真的令人着迷，每天丰富一点自己的知识面，通过积少成多，某一日我一定也能成为大牛，如果你也和我一样是个新手小白，那么就和我一起成长吧~~

前言

工作中碰到了一个棘手的事情，我们公司有封装自己的组件库，在我修复bug的时候，发现某一个bug的根本原因在于引用的某个组件中的if 语句的判断条件不太对。

第一想法是修改组件库，可是随之而来的就是一个新问题

我修改了组件库之后，要怎么才能在push代码之前看到效果呢？

好家伙，这我还真不知道？

先说一下问题的原因，组件库中判断条件是 !isUndefined(value) ，即 该值为不是undefined就执行if语句

而我的项目中该值为""，有基础的人就知道只有未定义才为undefined

但是本着方法总比困难多的原则，我试图绕过组件库，就在这个项目中修改，经过我的一番尝试之后，我还真发现了一个办法。

通过删除某个值的定义，让关联的该值为undefined

成功之后，我屁颠屁颠的跑去♀️提了PR，然后当我再次check PR的时候就看到了这样的场景

yarnlink1.png

大致意思就是，代码没有通过项目中编写的测试用例，因为测试用例不让该值为undefined！好家伙，卡着了，矛盾了有没有？我总不能更改测试用例吧？？

因此，绕了一圈，发现我还是得解决上面的问题，核心是在开发过程中，怎么把一个包链接到另一个项目 (ps:其实我觉得开发中遇到问题其实不可怕，因为百度大多可以解决，虽然耗时耗力了一点，可怕的事，百度的时候不知道如何描述)

下面就来介绍一下通过问导师然后再百度丰富的结果

什么是 yarn link？

• 开发中，两个项目或多个项目之间相互依赖时，用 yarn link连接，
• 例如：我们现在有项目B，B中利用npm / yarn 包管理器 引入了 包 A，A是我们自己开发封装的组件，我们修改了组件A的内容，在还没有重新发布组件A 的时候，想要在项目B 中 检查组件A修改的是否正确，这个时候就需要用到yarn link

如何使用 yarn link？

这里我想说一下，有些人通常用的是npm ，npm和yarn的作用是一样的，只是具体的指令有些许区别 而link的话，直接讲 yarn 换成 npm即可

1. 在包A （即封装好的组件库）中执行 yarn link

2. 对包A进行 想要的修改

3. 执行 yarn buid （打包代码：具体指令按照package.json中scrpit来执行）

4. 在项目B 中执行yarn link [包A的名称] 并重新执行 yarn 并清除浏览器缓存

5. 这个时候就能在项目B 中查看改动之后的效果

6. 结束之后，在项目B 中 执行 yarn unlink [包A的名字]来取消连接

本文由博客一文多发平台 OpenWrite 发布！