本节课代码地址 (opens in a new tab)

FunctionComponent需要考虑的问题：

• 如何支持FC？

• 如何组织Hooks？（下一节课讲解）

如何支持FC？

FC的工作同样植根于：

• beginWork

• completeWork

第二种调试方式

采用vite的实时调试，他的好处是 「实时看到源码运行效果」。

创建vite项目：

pnpm create vite  
 

使用vite而不是webpack作为demo调试的原因：

1. 在开发阶段编译速度快于webpack

2. vite的插件体系与rollup兼容

参考资料：vite强制预编译 (opens in a new tab)

课外资料

如果vite热更新失效，可能是因为 「书写的React组件不符合规范」，可以引入eslint-plugin-react-refresh (opens in a new tab)插件检查不符合规范的地方。