关于 fp-ts-react
面向 React 开发者的 fp-ts 实践指南，涵盖类型安全状态管理与数据请求模式。它按常见场景对应 fp-ts 类型和 Hook，并提醒集成示例需验证。
主要功能
- 01选择 Option、Either 和 TaskEither
- 02用 RemoteData 表示请求状态
- 03累积表单验证错误
- 04用 ReaderTaskEither 注入依赖
适用场景
- 01处理可选值和操作失败
- 02构建加载、错误和成功界面
- 03执行多规则表单验证
- 04在 React 或 Next.js 中采用函数式模式
安装
复制下面的命令，在终端中运行。
$
npx skills add https:/安装后在 Claude Code 中输入/fp-ts-react确认已加载。
附带文件references/detailed-guide.md
详细介绍
原文在翻译后有更新，译文可能不是最新。
React 中的函数式编程
React 应用的实用模式。没有术语，只有能跑起来的代码。
详细指南
在执行此技能之前，请阅读详细指南。其中保留了完整的流程和参考资料。将其安全、前置条件和验证要求视为强制要求。对于聚焦的工作，加载相关章节；对于端到端的工作，请完整阅读该指南。
何时使用此技能
- 在使用 fp-ts 构建 React 应用并进行类型安全的状态管理时
- 在数据获取中处理加载/错误/成功状态时
- 在实现带错误累积的表单验证时
- 在使用 React 18/19 或 Next.js 14/15 并采用函数式模式时
何时使用什么
| 情况 | 使用 |
|---|---|
| 值可能不存在 | Option<T> |
| 操作可能失败（同步） | Either<E, A> |
| 异步操作可能失败 | TaskEither<E, A> |
| 需要加载/错误/成功 UI | RemoteData<E, A> |
| 带多个验证的表单 | 带验证 applicative 的 Either |
| 依赖注入 | Context + ReaderTaskEither |
| 使用 fp-ts 防止重新渲染 | useMemo 或 fp-ts-react-stable-hooks |
限制
- 仅当任务与上述范围明确匹配时才使用此技能。
- 不要将输出视为特定环境验证、测试或专家评审的替代品。
- 如果缺少必需的输入、权限、安全边界或成功标准，请停止并请求澄清。
评论
支持 Markdown