Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx agentmods add rules/haidong-once/cursor-rules-collection/300-frontend-team-code-standardsgit clone --depth 1 https://github.com/HaiDong-Once/cursor-rules-collectionWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/rules/haidong-once/cursor-rules-collection/300-frontend-team-code-standards)<a href="https://agentmods.dev/rules/haidong-once/cursor-rules-collection/300-frontend-team-code-standards"><img src="https://agentmods.dev/badge/rules/haidong-once/cursor-rules-collection/300-frontend-team-code-standards.svg" alt="Measured on agentmods" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00000 | $0.04825 |
| Opus 5 | $0.00000 | $0.02413 |
| Sonnet 5 | $0.00000 | $0.00965 |
| Haiku 4.5 | $0.00000 | $0.00483 |
Grade A, and why
300-frontend-team-code-standards scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 6d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 681 lines — stays where its author put it; the contents beside it link to each section on GitHub.
前端团队开发规范
本规范旨在提高代码质量和开发效率，建立统一的开发标准和实践。
❤️ 表示强制遵守的规范，其余为建议性规范。
1. 命名规范
变量命名 ❤️
- 使用驼峰命名法：
let userInfo = {}，const orderId = 123 - 尽量避免缩写：使用完整的描述性命名，
let buttonSubmit比btnSub更清晰 - 布尔值应以
is,has,can,should开头，如：isValid,hasError - 常量使用全大写下划线分隔命名（力求语义表达完整清楚，不嫌名字长）：
const API_ENDPOINT = "https://a" - 数组命名：名词+List, 名词+s, 如：
userList
函数命名 ❤️
- 使用动词短语或（动词 或者 动词+名词 形式）：
getUserInfo(),fetchData(),validateForm() - 常用动词参考文档底部「命名规范常用动词参考」
组件命名 ❤️
- Vue 和 React 组件名使用大驼峰命名法：
UserProfile,OrderList
文件命名 ❤️
- 全部采用小写方式，以中划线分隔：
user-profile.vue，order-list.js - 每个文件只包含一个组件或一个功能模块，避免混杂多个功能
命名严谨性（可读性）❤️
- 代码中的命名严禁使用拼音与英文混合的方式，更不允许直接使用中文的方式（除特殊含义命名：如shuidi,jingdong)
- 杜绝完全不规范的缩写，避免望文不知义
避免魔法数字
// 魔法数字
if (state === 1 || state === 2) {
// ...
} else if (state === 3) {
// ...
}
// 魔法数字改用常量映射
const UNPUBLISHED = 1;
const PUBLISHED = 2;
const DELETED = 3;
if (state === UNPUBLISHED || state === PUBLISHED) {
// ...
} else if (state === DELETED) {
// ...
}
2. HTML规范
基本规范
- 缩进：缩进使用 2 个空格（一个 tab）
- 分块注释：在每一个组件模块，加上一对 HTML 注释
- 优先使用语义化标签：
<header></header><footer></footer> - 引号：统一使用双引号(
" ") 而不是单引号(' ')
3. CSS规范
命名 ❤️
- 使用有意义的类名，避免过于抽象的命名
选择器 ❤️
- CSS 选择器中避免使用标签名
- 使用直接子选择器
/* 不推荐 */
.content .title {
font-size: 2rem;
}
/* 推荐 */
.content > .title {
font-size: 2rem;
}
属性简写
- 尽量使用缩写属性
/* 不推荐 */
border-top-style: none;
font-family: palatino, georgia, serif;
font-size: 100%;
line-height: 1.6;
padding-bottom: 2em;
padding-left: 1em;
padding-right: 1em;
padding-top: 0;
/* 推荐 */
border-top: 0;
font: 100%/1.6 palatino, georgia, serif;
padding: 0 1em 2em;
- 省略 0 后面的单位
/* 不推荐 */
div {
padding-bottom: 0px;
margin: 0em;
}
/* 推荐 */
div {
padding-bottom: 0;
margin: 0;
}
- 尽量避免使用 ID 选择器及全局标签选择器防止污染全局样式
LESS 规范 ❤️
- 将公共 less 文件放置在同一全局文件夹
- 顺序组织
- @import
- 变量声明
- 样式声明
- 避免嵌套层级过多
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 6d ago First seen · 681 lines · 0 tokens per session scan A 10ef1d88cf8a
300-frontend-team-code-standards is a cursor rule published in the GitHub repository HaiDong-Once/cursor-rules-collection (24 stars, last pushed 1y ago), licensed MIT. It costs nothing until one of its globs matches a file; then it loads 4,825 tokens. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.
Other cursor rules, from other repositories
css-styling
CSS architecture, tokens, and styling rules for this Docusaurus site. Apply when creating or modifying components, styles, layouts, or any UI-facing code.
codex-premium-website-skills
Apply Codex Skills standards to frontend, website, motion, accessibility, QA, agent reasoning, and handoff work.
shadcn-tailwind-guide
本规范定义了使用 shadcn/ui 和 Tailwind CSS 开发新组件的标准流程和最佳实践。.
ui-components
USE WHEN: Building UI components, structuring layouts, and applying styles using Tailwind CSS.
performance
Frontend performance optimization rules. Apply when optimizing UI or bundle.
css-render-blocking-diagnosis
Cursor rule "css-render-blocking-diagnosis" from adobecom/da-express-milo, covering css render-blocking diagnosis & resolution, critical learning from 98 pagespeed achievement, primary diagnostic protocol, step 1: css blocking symptom recognition and step 2: css loading sequence audit.