文章

在 Cursor 中落地 Next.js 企业级开发规则的完整实践

见字如面,与大家分享实践中的经验与思考。

我撰写了多篇关于 Cursor Rules 规则实践的原创文章,感兴趣的读者可以通过以下链接深入了解:

“纸上得来终觉浅”,我基于企业级官网定制化和进销存企业管理平台等多个实战项目的实践,设计出一套适用于企业级全栈开发的 Cursor Rules 规则(涵盖 Next.js 16 + React 19 + Shadcn/ui + TailwindCSS),现将其开源分享。文末附有源码地址及实战项目截图。

Cursor Rules 架构

正式分享前,我们先回顾一下我此前提出的“三层架构”和“四大原则”:

images-20251205-17.17.08@2x

images-20251205-17.17.30@2x

企业级实战规则

首先,根据三层架构定义核心规则文件,结构参考如下:

images-20251205-17.24.18@2x

接着,遵循 Cursor MSEC 原则,依次定制符合项目需求的 AI 规则。

01 通用规则

code.mdc:将 Rule Type 设置为 Always。这是项目中优先级最高的指令,内容应尽量精简。

images-20251205-17.28.43@2x

02 语言规则

针对 Next.js 项目中使用的 TypeScript 语言,将 Rule Type 设置为 Apply To Specific Files,并匹配文件后缀 *.ts*.tsx

images-20251205-17.30.21@2x

03 框架规则

在 Next.js 项目中,本人通常会采用 Next.js 16 + React 19 + Shadcn/ui 等技术栈。以下是针对各框架的具体规则配置:

Next.js 16

images-20251205-17.32.15@2x

React 19

images-20251205-17.32.32@2x

Shadcn/ui

images-20251205-17.32.49@2x

Tailwind 4

images-20251205-17.33.36@2x

React-Hook-Form

images-20251205-17.35.09@2x

Zod

images-20251205-17.35.33@2x

Zustand

images-20251205-17.36.00@2x

最后

本文涉及的所有规则文件均已整理并开源至 GitHub 仓库,欢迎查阅和复用:

https://github.com/flyeric0212/cursor-rules

随着 AI 模型能力的不断增强,以及按 Token 计费模式的普及,规则的简洁性与高效性显得尤为重要。建议大家结合项目实际情况及 MSEC 理论,开发出适合自己的项目规则,并通过持续迭代与完善,大幅提升开发效率。

附录

以下是基于上述 Cursor AI 规则开发的部分项目实战截图:

images-20251205-17.39.23@2x

images-20251205-17.40.34@2x

如果你所在企业也有进销存、库存管理、流程梳理等需求,可以私信一起讨论技术方案。


欢迎关注公众号"Eric技术圈",原创技术文章第一时间推送。

许可协议:  CC BY 4.0