tanstack
基于TanStack生态构建类型安全的React全栈应用。
安装使用
复制下面这段提示词发给你的 AI（Claude / Cursor / TRAE / Codex / WorkBuddy 等），它会自动帮你完成安装：
帮我安装这个 AI Skill：tanstack。 它的用途是：基于TanStack生态构建类型安全的React全栈应用。 完整的 Skill 内容见：https://321skill.com/skills/tanstack-x/raw/index.md 请读取该页面内容，如果是 SKILL.md 格式直接安装，如果是 README 提炼核心 prompt 后安装。
提示词包含完整的 Skill 内容链接，AI 读取后即可完成安装。你也可以 查看完整内容 确认无误。
使用示例
‘帮我用TanStack Query和Router搭建一个博客应用的数据获取和路由骨架。’，它会指导你安装必要的包，创建基于文件的路由结构，并编写类型安全的页面组件和数据获取钩子，确保从API获取文章列表和详情时的缓存与状态同步。
介绍
TanStack Skill旨在解决React开发者构建现代、类型安全Web应用时面临的复杂状态管理、路由和数据获取等问题。它整合了TanStack Query（数据获取、缓存、状态同步）、TanStack Router（基于文件的路由、搜索参数、加载器）和TanStack Start（SSR、服务端渲染）等核心库，为开发者提供了一套完整、类型安全且高性能的解决方案。
开发者通过安装并配置相应的TanStack库，即可在项目中启用这些功能。例如，使用TanStack Query的useQuery钩子进行数据获取，利用TanStack Router的文件系统自动生成路由，并通过TanStack Start实现服务端渲染，从而构建出从数据层到UI层的全栈应用。
该Skill非常适合希望提升开发效率、保证代码质量的前端开发、全栈开发和智能体开发者。尤其适合那些正在构建中大型、对类型安全和性能有较高要求的React应用团队。
使用建议：建议开发者从官方文档入手，逐步引入各个库。由于TanStack生态强调类型安全，建议与TypeScript深度结合使用。注意，这套方案更适合有一定React和TypeScript基础的开发者，对于小型项目或原型，可能显得略重。
核心特点
与单一状态管理或路由库不同，TanStack Skill提供了一套深度集成、类型安全的全栈React开发方案，其Router的基于文件的路由和类型安全的搜索参数管理是显著特色，能极大提升大型应用的路由开发体验和可靠性。
注意事项
不适合只需要简单状态管理或路由的小型项目或快速原型开发，学习曲线相对较陡。
常见问题
TanStack Query和React Query是什么关系？
TanStack Query是React Query的新名称，属于TanStack生态的一部分，功能相同。
TanStack Router和React Router有什么区别？
TanStack Router是全新的、基于文件系统的类型安全路由库，与React Router是不同实现，更强调类型安全和开发体验。
给 AI 助手的安装指引
如果你的 AI 编程助手（Claude Code、Cursor、TRAE 等）能看到这个页面，把下面这段发给它即可自动完成安装：
请访问 https://321skill.com/skills/tanstack-x/raw/index.md 读取 tanstack 的原始 Skill 定义（Markdown 格式），按其中说明在我的环境里完成安装和配置。
AI 可直接读取的原始 Markdown 地址：/skills/tanstack-x/raw/index.md（查看排版版本）