 

10-工程化与生态第2页

React 工程化与生态：TypeScript、样式方案、测试、代码规范、组件分层、设计系统、Monorepo、微前端、PWA、无障碍，以及 React Native 与 Expo。

10.5 代码规范

规范工具链的分工是「Prettier 管格式、ESLint 管正确性与坏味道、TypeScript 管类型」——其中 eslint-plugin-react-hooks 的两条规则最关键（rules-of-hooks 是 error、exhaustive-deps 至少 warn）。

陌上寒2026-10-17阅读()去评论

React 测试的核心思想是「像用户一样测试」——用 Testing Library 按「角色/文本」查元素、用 userEvent 模拟真实交互、断言「用户能看到什么」，而不是断言「组件内部的实现细节」。

陌上寒2026-10-17阅读()去评论

压缩、裁剪、加水印、抠图、拼接都在本地完成。不限张数、不限次数，图片不会传到服务器。

2026-10-18

主流方案有四种——CSS Modules（无运行时、作用域隔离）、Tailwind（原子化、无运行时）、CSS-in-JS（有运行时开销）、普通 CSS/Sass（需自己管命名）；

陌上寒2026-10-17阅读()去评论

React + TS 的核心是「把 props、事件、children、ref 的类型写准」——基础组件要 extends React.XxxHTMLAttributes 才能透传原生属性，容器组件用泛型让类型跟着数据走。

陌上寒2026-10-17阅读()去评论

SPA 项目用 Vite（开发极快、原生 ESM、生态成熟），需要 SEO/SSR/全栈能力用 Next.js，CRA 已停止维护不要再用；构建阶段关心的是「依赖预构建、HMR、产物优化、环境变量」。

陌上寒2026-10-17阅读()去评论