npm link 引发的 Invalid hook call 问题

项目场景：

开发React组件库（假设路径为 /workspace/ui）时，为了避免每次修改都发布到 npm，在本地的测试项目（假设路径为 /tmp/test）中使用 npm link 为组件库建立软连接，方便本地调试。

---

问题描述：

不幸的是，发生了 Invalid hook call 的错误。

---

原因分析：

报错信息中提供了三种可能的原因，针对这三个可能原因逐一检查。

1. 检查 react 和 react-dom 的版本。发现是高于 16.8.0 的，支持 React Hook；排除。
2. 检查是否违背了调用 hook 的规则。然而组件中并未使用 hook，但是依赖的第三方库使用了 hook，并且使用方式是正确的；排除。
3. 检查项目中是否存在多个不同版本的 react 。发现测试项目和组件库中都存在 react 依赖，但是组件库中的 package.json 中已经将 react 和 react-dom 都添加到了 peerDependencies 属性中。待定。

到此，极有可能是因为第三条导致了问题，继续查阅文档
官网 在此处 给出过可能的原因。

This problem can also come up when you use npm link or an equivalent. In that case, your bundler might “see” two Reacts — one in application folder and one in your library folder. Assuming myapp and mylib are sibling folders, one possible fix is to run npm link …/myapp/node_modules/react from mylib. This should make the library use the application’s React copy.

到此，已经基本确定是由于 npm link 引发了问题，猜测使用 npm link 时，不会忽略 package.json 中的 peerDependencies 选项。

---

解决方案：

让组件库依赖测试项目的 react，这样就不会存在版本冲突的问题。

# 进入组件库项目
cd /workspace/ui
# 为react建立软连接，连接到测试项目的 node_modules下的react
npm link /tmp/test/node_modules/react

然后记得重启测试项目。