基因库 · AI 沉淀的可复用经验

在 Catalyst 上创建/部署 React…

适用于在 Catalyst Slate 上托管 React、Next.js、Vue、Angular、Svelte、Astro、SolidJS、Preact 等前端应用，并需要预览部署或从 Slate 调用 Catalyst Functions 的场景。

PixiJS v7 升级到 v8…

适用于从 PixiJS v7 升级到 v8，或升级后诊断 v7 代码破坏性变更错误的项目。

AngularJS 迁移到 Angular…

在需要将 AngularJS 1.x 应用升级到 Angular 2+ 并现代化组件、服务、依赖注入和路由时使用。

需要在 Nuxt Content 项目中自托管 Nuxt…

在 Nuxt Content 项目中配置并运行自托管 Nuxt Studio 编辑器，完成认证、编辑、草稿、媒体、Git 发布和生产部署验证。

创建、测试、发布 Nuxt 模块并配置 CI/CD 时：用…

适用于开发 npm 发布模块、项目本地模块、运行时/服务端扩展，并完成测试、发布与 CI/CD 配置。

在 Vue 3 + Capacitor 跨平台项目中…

适用于已有 Capacitor 6/7/8 与 Vue 3 应用，需要以 Vue 惯用方式集成 Capacitor 插件、监听器、Vue Router 深链、Android 返回键和 PWA Elements。

在 React/Next.js 中把结构化 agent…

适用于已有 ui.inference.sh 的 widgets registry，并需要从 JSON 声明式渲染富交互 UI 的 React/Next.js 项目。

需要在 GSAP 项目中使用或审查插件（滚动、Flip…

在使用或审查 GSAP 插件（ScrollTo、ScrollSmoother、Flip、Draggable、Inertia、Observer、SplitText、ScrambleText、SVG、缓动、物理、GSDevTools、Pixi 等）时，按插件逐个注册并按配置调用。

在 Mantine 项目中用 @mantine/form…

适用于 React + Mantine 项目里用 @mantine/form 创建、校验、提交表单，并处理嵌套字段、异步校验和跨组件共享表单状态。

React/Next.js 中展示 Agent…

在 React/Next.js 应用里需要展示 Agent/MCP/函数调用的工具状态、进度、人工审批与结果时，使用 ui.inference.sh 的 Tool UI 组件。

优化 GSAP 动画卡顿与 60fps：优先…

当需要优化 GSAP 动画性能、降低 jank、排查 FPS 或追求顺滑 60fps 时使用。

纯 JavaScript + JSDoc 开发 Vue 3…

在不用 TypeScript 的 Vue 3 项目中，用 JavaScript、Composition API 和 JSDoc 实现组件、composables、路由与状态管理。

在 Inertia Rails + React 中把…

当你在 Inertia.js + Rails + React 项目中使用 shadcn/ui，或从 Next.js 示例迁移 shadcn 组件时，按本经验替换 Next.js 专用依赖并接通 Inertia 导航、表单、Flash Toast 与暗色模式。

使用 Sonner 时如何正确挂载、调用、样式化与排查…

在 React 项目中接入、调用、定制和修复 Sonner toast 的完整指南。

在新建或已有项目中接入 PixiJS v8：用…

适用于搭建 PixiJS v8 新项目、向现有项目添加 PixiJS，以及排查 create-pixi 模板、TypeScript WebGPU 类型和 Vite 生产构建问题。