SuperAPI AI 工具集

tamagui-best-practices

前端与建站

查看项目

更新于 10-16 01:35

技能介绍

用途:为 Tamagui v1.x 项目提供超出基础用法的模式参考,重点在 Config v4、编译器优化、复合组件与常见错误规避。

主要能力:按组件类型要求先阅读对应模式文件,如 Dialog/Sheet 读 @DIALOG_PATTERNS.md,表单读 @FORM_PATTERNS.md,动画读 @ANIMATION_PATTERNS.md,浮层读 @OVERLAY_PATTERNS.md,编译器优化读 @COMPILER_PATTERNS.md,设计令牌与主题读 @DESIGN_SYSTEM.md。

使用方式:Config v4 用 @tamagui/config/v4 的 defaultConfig 配合 createTamagui;新项目可设 settings.styleCompat 为 'react-native'。自定义主题用 createThemes 的 palette/accent/childrenThemes。令牌在 props 用 $ 前缀,主题定义中不带 $。变体可用 '...size'、'...fontSize' 等展开运算符,并加 as const。复合组件用 createStyledContext 与 withStaticProperties;包装组件用 .styleable() 保留变体继承;自定义组件用 accept 支持令牌解析。

限制与注意:context 模式不适用于编译器扁平化,仅用于 Button、Card 等高层组件。避免动态样式、内联函数、混用 RN StyleSheet、手动 Platform.OS 分支,应改用变体、useCallback、Adapt。prop 顺序影响覆盖优先级。最新 API 可用 curl 拉取 tamagui.dev 的 .md 文档。