name: 特性架构 description: React特性驱动架构指南，用于可扩展应用程序（原特性架构）。此技能应用于编写、审查或重构React代码时，确保正确的特性组织。触发涉及项目结构、特性组织、模块边界、跨特性导入、数据获取模式或组件组合的任务。
特性驱动架构最佳实践
全面架构指南，用于通过特性组织React应用程序，使独立团队实现可扩展开发。包含8个类别共42条规则，按影响从关键（目录结构、导入）到增量（命名约定）优先排序。
适用时机
参考这些指南当：
- 创建新特性或模块
- 组织项目目录结构
- 设置导入规则和边界
- 实现数据获取模式
- 组合来自多个特性的组件
- 审查代码以查找架构违规
规则类别按优先级排序
| 优先级 | 类别 | 影响 | 前缀 |
|---|---|---|---|
| 1 | 目录结构 | 关键 | struct- |
| 2 | 导入与依赖 | 关键 | import- |
| 3 | 模块边界 | 高 | bound- |
| 4 | 数据获取 | 高 | fquery- |
| 5 | 组件组织 | 中高 | fcomp- |
| 6 | 状态管理 | 中 | fstate- |
| 7 | 测试策略 | 中 | test- |
| 8 | 命名约定 | 低 | name- |
快速参考
1. 目录结构（关键）
struct-feature-folders- 按特性组织，而非技术类型struct-feature-self-contained- 使特性自包含struct-shared-layer- 仅用于真正通用代码的共享层struct-flat-hierarchy- 保持目录层次扁平struct-optional-segments- 仅包含必要部分struct-app-layer- 将应用层与特性分离
2. 导入与依赖（关键）
import-unidirectional-flow- 强制单向导入流import-no-cross-feature- 禁止跨特性导入import-public-api- 仅通过公共API导出import-avoid-barrel-files- 避免深度barrel文件重新导出import-path-aliases- 使用一致的路径别名import-type-only- 使用仅类型导入用于类型
3. 模块边界（高）
bound-feature-isolation- 强制特性隔离bound-interface-contracts- 定义明确的接口合同bound-feature-scoped-routing- 将路由限定于特性关注点bound-minimize-shared-state- 最小化特性间的共享状态bound-event-based-communication- 使用事件进行跨特性通信bound-feature-size- 保持特性规模适当
4. 数据获取（高）
fquery-single-responsibility- 保持查询函数单一职责fquery-colocate-with-feature- 将数据获取与特性共置fquery-parallel-fetching- 并行获取独立数据fquery-avoid-n-plus-one- 避免N+1查询模式fquery-feature-scoped-keys- 使用特性限定查询键fquery-server-component-fetching- 在服务器组件级别获取
5. 组件组织（中高）
fcomp-single-responsibility- 对组件应用单一职责原则fcomp-composition-over-props- 优先组合而非属性透传fcomp-container-presentational- 分离容器和表现层关注点fcomp-props-as-data-boundary- 使用属性作为特性边界fcomp-colocate-styles- 将样式与组件共置fcomp-error-boundaries- 使用特性级错误边界
6. 状态管理（中）
fstate-feature-scoped-stores- 将状态存储限定于特性fstate-server-state-separation- 分离服务器状态与客户端状态fstate-lift-minimally- 仅将状态提升到必要高度fstate-context-sparingly- 谨慎使用上下文处理特性状态fstate-reset-on-unmount- 在卸载时重置特性状态
7. 测试策略（中）
test-colocate-with-feature- 将测试与特性共置test-feature-isolation- 孤立测试特性test-shared-utilities- 创建特定于特性的测试实用工具test-integration-at-app-layer- 在应用层编写集成测试
8. 命名约定（低）
name-feature-naming- 使用领域驱动特性名称name-file-conventions- 使用一致的文件命名约定name-descriptive-exports- 使用描述性导出名称
如何使用
阅读个别参考文件以获取详细解释和代码示例：
相关技能
- 用于特性规划，参见
feature-spec技能 - 用于数据获取，参见
tanstack-query技能 - 用于React组件模式，参见
react-19技能
完整编译文档
完整指南与所有规则扩展：AGENTS.md