AGENT SKILL
react-native-dls
Enforce design token usage in React Native. Use when enforcing a design system, preventing hardcoded styles, or implementing theme tokens in React Native. (triggers: **/*Screen.tsx, **/*Component.tsx, **/theme/**, **/styles/**, StyleSheet, styled-components, theme, colors, spacing)
- License 许可
- MIT
- 最近更新
- 2026-06-24
- Stars
- ★ 67
- Forks
- 24
01 前言 Front Matter
- name
- react-native-dls
- description
- Enforce design token usage in React Native. Use when enforcing a design system, preventing hardcoded styles, or implementing theme tokens in React Native. (triggers: **/*Screen.tsx, **/*Component.tsx, **/theme/**, **/styles/**, StyleSheet, styled-components, theme, colors, spacing)
02 资源文件 3
- 参考文档agents/openai.yaml262 B
- 脚本scripts/analyze_flamegraph_json.py10.5 KB
- 脚本scripts/collect_ios_dsyms.sh5.9 KB
03 SKILL.md 正文
React Native Design System
Priority: P1 (OPERATIONAL)
Enforce design token usage in React Native apps.
Guidelines
- Structure: Define tokens in
theme/colors.ts,spacing.ts,typography.ts. - Usage: Import tokens (
colors.primary) instead of literals (#000). - Styling: Compatible with
StyleSheetandstyled-components.
Anti-Patterns
- No Inline Colors: Use
'#FF0000'→ Error. Import fromtheme/colors. - No Magic Spacing: Use
padding: 16→ Error. Usespacing.md. - No Inline Fonts: Define
fontSize: 20→ Error. Usetypography.h1.
References
See references/usage.md for design token usage examples.