使用Yalc在项目中进行组件库调试

背景

在开发组件库的过程中，我们多数情况下会希望直接在我们的业务项目中调试我们的公共组件，这样能直接反映公共组件在项目中的表现，及时发现和处理问题。

组件库与项目联调有多种方案，比如yarn link, npm link, 创建软链接等， 根据目前的实践，推荐使用 yalc, 它会避免link方式产生的一些问题。
比如在使用了react的组件库中，很容易产生下面这个问题，使用yalc就不会有。

Uncaught Invariant Violation: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app

yalc使用方法

1. 全局安装yalc

yarn global add yalc

2. 发布到本地
   在组件库目录运行下面命令 , yalc会将你的组件库发布到你本地，我们假设你的组件库名字叫做 my-components

yalc publish

3. 添加
   在使用该组件库的项目中添加本地依赖

yalc add my-components

4. 组件代码更新

# 编译代码
yarn build

# 发布更新(会自动更新你业务项目中对该组件库的依赖)
yalc push 

5. 注意yalc add以后会修改项目的package.json, 完成联调以后应该去掉这个本地依赖

yalc remove --all

更多具体用法可以参考 yalc的文档