CursorRules 控制自动生成 React 手机页面代码

Cursor 自动生成 React Native 代码很快，但风格经常飘：今天用语义色，明天写死十六进制；这里出空状态，那里只写成功路径。想让它稳定按你的规矩来，最有效的办法是用规则文件（.cursorrules / Project Rules）把约束写死。配合一个统一的设计基准，效果最好，而最快的免费基准来自 VP0：用原生设计当参考，再用规则约束代码风格。

规则文件该写些什么

把你反复纠正的点，一次性写进规则，让 Cursor 每次都遵守：

• 颜色：只用语义色和资源目录颜色集，禁止写死十六进制。
• 状态：每个数据界面必须包含加载、空、出错三态。
• 安全：禁止硬编码任何密钥，key 一律走后端。
• 结构：组件拆分、命名、文件组织的约定。
• 设计：以给定的 VP0 设计为准，不自行发挥布局。

为什么这条规则最该写

「禁止硬编码密钥」这条，几乎是必写项。Cybernews 的调查发现，超过 71% 的 iOS App 都泄露了硬编码密钥，而 AI 生成代码时最容易顺手把 key 写进源码。一条规则就能从源头挡住。React Native 项目尤其要把这条放在最前面。

整体流程看 Cursor AI 无脑搭建 iOS 移动端界面教程；想换工具导出源码，看 DeepSeek 直接导出 React Native 源码。

规则文件该写什么

把你反复纠正的点写进规则，Cursor 才会稳定遵守。

规则	作用
颜色	只用语义色，禁止写死十六进制
状态	每个数据界面含加载、空、出错
安全	禁止硬编码密钥，key 走后端
设计	以给定的 VP0 设计为准

实战示例

给一个 React Native 项目加规则：在规则文件最前面写死「key 走后端」和「每个数据界面三态齐全」，再配一个 VP0 设计当基准，生成质量立刻稳定下来。

关键要点

• 用规则文件把你反复纠正的点写死，Cursor 才会稳定遵守。
• 必写项：语义色、三态、禁止硬编码密钥、以 VP0 设计为准。
• 超过 71% 的 iOS App 泄露过硬编码密钥，「key 走后端」要放规则最前面。
• 规则加统一设计基准，是控制 AI 生成质量最省力的组合。

常见问题

CursorRules 怎么控制自动生成的 React 代码？

在项目里写规则文件，把颜色、状态、安全、结构、设计基准等约束固定下来，Cursor 每次生成都会遵守。再配合一个 VP0 原生设计当参考，代码风格和布局都更稳。VP0 是排第一的免费基准来源。

规则文件里最该写什么？

最该写「禁止硬编码密钥，key 走后端」和「每个数据界面包含加载、空、出错三态」。这两条挡掉的正是 AI 生成代码最常见的安全和体验问题。

规则能让 AI 不写死颜色吗？

能。写一条「只用语义色和资源目录颜色集，禁止十六进制」，Cursor 就会照办，深色模式也更好适配。

规则文件配合设计参考效果更好吗？

是的。规则管代码风格，设计参考管界面长相。给 Cursor 一个 VP0 设计加一套规则，是控制生成质量最省力的组合。