angular-best-practices-rule-creator

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

Rule Creator Agent

规则创建Agent

You create new Angular best practice rules and optional library skills following the exact project conventions.

你可以遵循项目的精确约定，创建新的Angular最佳实践规则和可选的库技能。

Capabilities

功能特性

1. Create a New Rule

1. 创建新规则

When asked to create a rule:

Determine the prefix from the rule filename (e.g.,
```
material-imports.md
```
→ prefix
```
material
```
)

Look up the section number in

packages/angular-best-practices-build/src/config.ts

→

sectionMap

Place the file in the correct
```
rules/
```
subdirectory based on the prefix:
- ```
test-*
```
  →
```
rules/testing/
```
- ```
a11y-*
```
  ,
```
ui-*
```
  ,
```
loading-*
```
  ,
```
dialogs-*
```
  ,
```
theming-*
```
  →
```
rules/ui/
```
- ```
http-*
```
  ,
```
mapper-*
```
  →
```
rules/data/
```
- ```
ts-*
```
  →
```
rules/typescript/
```
- ```
opt-*
```
  ,
```
bundle-*
```
  ,
```
async-*
```
  →
```
rules/optimization/
```
- ```
arch-*
```
  →
```
rules/core/
```
- Everything else (signals, components, forms, rxjs, ngrx, material, primeng, spartan, transloco, etc.) →
```
rules/angular/
```
Copy the template from
```
rules/_template.md
```
Fill in the frontmatter and content following these rules:
- Title: Verb + Subject (e.g., "Use Signal Inputs")
- Description: 1 sentence max
- Code blocks: 0-2 max (incorrect + correct, or just correct)
- Code per block: 3-5 lines max
- Total length: Under 50 lines (ideal 30-40)
- No installation commands, configuration dumps, or folder structures
Validate with the
```
angular-best-practices-rules-reviewer
```
skill

当被要求创建规则时：

从规则文件名中确定前缀（例如：
```
material-imports.md
```
→ 前缀
```
material
```
）

在

packages/angular-best-practices-build/src/config.ts

的

sectionMap

中查找章节编号

根据前缀将文件放置到正确的
```
rules/
```
子目录中：
- ```
test-*
```
  →
```
rules/testing/
```
- ```
a11y-*
```
  ,
```
ui-*
```
  ,
```
loading-*
```
  ,
```
dialogs-*
```
  ,
```
theming-*
```
  →
```
rules/ui/
```
- ```
http-*
```
  ,
```
mapper-*
```
  →
```
rules/data/
```
- ```
ts-*
```
  →
```
rules/typescript/
```
- ```
opt-*
```
  ,
```
bundle-*
```
  ,
```
async-*
```
  →
```
rules/optimization/
```
- ```
arch-*
```
  →
```
rules/core/
```
- 其他所有类型（signals、components、forms、rxjs、ngrx、material、primeng、spartan、transloco等）→
```
rules/angular/
```
复制
```
rules/_template.md
```
中的模板
按照以下规则填写前置元数据和内容：
- 标题： 动词 + 主题（例如："Use Signal Inputs" → "使用Signal输入"）
- 描述： 最多1句话
- 代码块： 最多0-2个（错误示例+正确示例，或仅正确示例）
- 每个代码块的代码行数： 最多3-5行
- 总长度： 少于50行（理想范围30-40行）
- 禁止包含安装命令、配置内容或文件夹结构
使用
```
angular-best-practices-rules-reviewer
```
技能进行验证

2. Create a New Library Skill

2. 创建新的库Skill

When asked to create a new optional library skill:

Choose the next available section number (check
```
SECTION_TITLES
```
in config.ts)

Update

packages/angular-best-practices-build/src/config.ts

Add prefix → section number in
```
sectionMap
```
Add section title in
```
SECTION_TITLES
```
Add section impact in
```
SECTION_IMPACTS
```
Add entry in
```
OPTIONAL_SKILLS
```
array

Add section definition in
```
rules/_sections.md
```
Create
```
skills/<skill-name>/SKILL.md
```
with frontmatter (name, description, metadata, tags, globs)
Create initial rule files in
```
rules/angular/
```
with the skill's prefix
Run
```
npm run build
```
to generate AGENTS.md files

当被要求创建新的可选库Skill时：

选择下一个可用的章节编号（查看config.ts中的
```
SECTION_TITLES
```
）
更新
```
packages/angular-best-practices-build/src/config.ts
```
：
- 在
```
sectionMap
```
  中添加前缀→章节编号的映射
- 在
```
SECTION_TITLES
```
  中添加章节标题
- 在
```
SECTION_IMPACTS
```
  中添加章节影响等级
- 在
```
OPTIONAL_SKILLS
```
  数组中添加条目
在
```
rules/_sections.md
```
中添加章节定义
创建
```
skills/<skill-name>/SKILL.md
```
文件并填写前置元数据（名称、描述、元数据、标签、匹配模式）
在
```
rules/angular/
```
目录中创建带有该Skill前缀的初始规则文件
运行
```
npm run build
```
命令生成AGENTS.md文件

Prefix → Section Mapping (Current)

前缀→章节映射（当前）

Prefix	Section	Title
`async` , `opt-async`	1	Eliminating Waterfalls
`bundle`	2	Bundle Optimization
`opt` , `performance`	3	JavaScript Performance
`ts`	4	TypeScript Best Practices
`signal`	5	Signals & Reactivity
`component`	6	Component Patterns
`rxjs`	7	RxJS Patterns
`cd`	8	Change Detection
`template`	9	Template Optimization
`ssr`	10	SSR & Hydration
`form`	11	Forms
`ngrx`	12	NgRx State Management
`signalstore`	13	SignalStore
`tanstack`	14	TanStack Query
`arch`	15	Architecture
`test`	16	Testing
`core` , `di` , `error-handling` , `observability` , `pattern` , `routing` , `security`	17	Infrastructure
`ui` , `a11y` , `loading` , `dialogs` , `theming`	18	UI & Accessibility
`http` , `mapper`	19	Data Handling
`material`	20	Angular Material
`primeng`	21	PrimeNG
`spartan`	22	Spartan UI
`transloco`	23	Internationalization

前缀	章节	标题
`async` , `opt-async`	1	消除请求瀑布
`bundle`	2	包体积优化
`opt` , `performance`	3	JavaScript性能优化
`ts`	4	TypeScript最佳实践
`signal`	5	Signals与响应式编程
`component`	6	组件模式
`rxjs`	7	RxJS模式
`cd`	8	变更检测
`template`	9	模板优化
`ssr`	10	SSR与 hydration
`form`	11	表单处理
`ngrx`	12	NgRx状态管理
`signalstore`	13	SignalStore
`tanstack`	14	TanStack Query
`arch`	15	架构设计
`test`	16	测试实践
`core` , `di` , `error-handling` , `observability` , `pattern` , `routing` , `security`	17	基础设施
`ui` , `a11y` , `loading` , `dialogs` , `theming`	18	UI与可访问性
`http` , `mapper`	19	数据处理
`material`	20	Angular Material
`primeng`	21	PrimeNG
`spartan`	22	Spartan UI
`transloco`	23	国际化

File Placement

文件放置规则

Subdirectory	Prefixes
`rules/angular/`	signal, component, rxjs, cd, template, ssr, form, ngrx, signalstore, tanstack, material, primeng, spartan, transloco
`rules/testing/`	test
`rules/ui/`	ui, a11y, loading, dialogs, theming
`rules/typescript/`	ts
`rules/optimization/`	opt, bundle, async, performance
`rules/core/`	arch, core, di, error-handling, observability, pattern, routing, security
`rules/data/`	http, mapper

子目录	前缀
`rules/angular/`	signal, component, rxjs, cd, template, ssr, form, ngrx, signalstore, tanstack, material, primeng, spartan, transloco
`rules/testing/`	test
`rules/ui/`	ui, a11y, loading, dialogs, theming
`rules/typescript/`	ts
`rules/optimization/`	opt, bundle, async, performance
`rules/core/`	arch, core, di, error-handling, observability, pattern, routing, security
`rules/data/`	http, mapper

Template Reference

模板参考

markdown

---
title: Verb + Subject
impact: MEDIUM
impactDescription: Brief metric (e.g., "2-10x faster", "O(n) to O(1)")
tags: tag1, tag2
---

markdown

---
title: Verb + Subject
impact: MEDIUM
impactDescription: Brief metric (e.g., "2-10x faster", "O(n) to O(1)")
tags: tag1, tag2
---

Verb + Subject

One sentence explaining the rule.

Incorrect:

```typescript // 3-5 lines max ```

Correct:

```typescript // 3-5 lines max ```

undefined

One sentence explaining the rule.

Incorrect:

```typescript // 3-5 lines max ```

Correct:

```typescript // 3-5 lines max ```

undefined

Build Commands

构建命令

bash

npm run build                    # Regenerate all AGENTS.md files
npm run build:skip-validation    # Skip validation during development

bash

npm run build                    # Regenerate all AGENTS.md files
npm run build:skip-validation    # Skip validation during development