CopilotCodePro规则

规则文件和工作流仅适用于VSCode编辑器的Pro外网模型版本。

一、什么是.CopilotCodeProrules?

CopilotCodePro规则允许您为CopilotCodePro提供系统级指导。将它们视为一种持久的方式，用于为您的项目或全局每个对话包含上下文和首选项。

简单来说，.CopilotCodeProrules 就是一个需要放在项目根目录的”说明书”。所以需要提前把编码规则、项目结构、注意事项写在这个文件里，AI 就会自动按照这些”要求”来帮你做事情。

二、如何创建和编写规则文件？

规则分为全局规则和当前工作区的规则，可以根据需要选择创建全局规则还是当前工作区的规则。

规则文件采用markdown的语法编写，有两种方式可以添加rules：

方式一：手动创建

您可以通过单击 管理CopilotCodePro规则和工作流的图标，进入规则选项卡，点击中的 + 按钮来创建规则。这将在您的 IDE 中打开一个新文件，您可以使用它来编写规则。保存规则文件后，您可以在规则选项卡中看到它。

全局规则：将会存储在本地安装的 Documents/CopilotCodePro/Rules/ 目录中，对使用插件的所有项目生效。
当前工作区规则：将会存储在当前工作区的 .CopilotCodeProrules/ 目录中，只对当前工作区的项目生效。

方式二：可以通过在聊天中使用/newrule 指令为您创建一个规则

根据需求再进行手动编辑规则文件，该方式只适用于创建当前工作区规则。

生成规则后，将会将文件存在.CopilotCodeProrules/目录下，生成的tech-stack-guidelines.md的内容如下：

# .CopilotCodeProrules/tech-stack-guidelines.md

## Brief overview

本规则针对智效代码项目的技术框架使用规范，基于项目实际采用的 Vue 3、Vue Router 4、Axios、TailwindCSS、MCP 服务器集成等技术栈制定的开发指导原则。



## Vue 3 开发规范

- 强制使用 Composition API，禁止使用 Options API

- 使用 `const` 声明所有函数和变量，格式：`const functionName = () => {}`

- 事件处理函数统一使用 "handle" 前缀命名

- 组件名使用 PascalCase，文件名使用 kebab-case

- 优先使用 `ref()` 和 `reactive()` 进行状态管理

- 使用 `onMounted()`、`onUnmounted()` 等组合式生命周期钩子



## 路由管理规范

- 使用 Vue Router 4 进行路由配置

- 实现路由懒加载优化首屏性能：`component: () => import('@/views/ComponentName.vue')`

- 设置路由守卫进行身份验证检查

- 路由路径使用 kebab-case 命名

- 受保护路由必须包含 `requiresAuth: true` 元数据



## 样式开发规范

- 严格使用 TailwindCSS 工具类，禁止编写自定义 CSS

- 避免在组件中使用 `<style>` 标签

- 响应式设计使用 Tailwind 断点：`sm:`、`md:`、`lg:`、`xl:`

- 颜色和间距使用 Tailwind 预定义值

- 组件样式通过 Tailwind 类组合实现



## API 请求处理

- 使用 Axios 作为 HTTP 客户端

- 在 `services/` 目录下封装所有 API 调用

- 统一错误处理和响应拦截

- 请求配置包含认证 token 和超时设置

- API 方法使用 async/await 语法



## MCP 服务集成

- MCP 服务器代码独立在 `mcp_servers/` 目录管理

- 支持多种服务：AWS、GitHub、GitLab、Google Maps、PostgreSQL、Redis

- 每个 MCP 服务包含独立的 package.json 和 Dockerfile

- 使用 TypeScript 开发 Node.js 类型的 MCP 服务器

- Python MCP 服务器使用 uv 包管理器



## 认证系统规范

- 基于 Cookie 和 JWT 的双重认证机制

- 在 `services/auth.js` 中封装认证相关方法

- 实现自动 token 刷新和过期处理

- 登录状态在路由守卫中验证

- 用户信息存储使用响应式状态管理



## 组件开发规范

- 页面级组件放置在 `src/views/` 目录

- 可复用组件放置在 `src/components/` 目录

- 组件必须实现完整的无障碍功能：aria-label、tabindex、键盘导航

- 避免使用 TODO 注释，所有功能必须完整实现

- 组件导入使用绝对路径或别名



## 容器化部署

- 使用 Docker 进行应用容器化

- 前端应用使用 `Dockerfile_front` 构建镜像

- 支持多阶段构建优化镜像大小

- 生产环境配置资源压缩和缓存策略

- 容器内使用 nginx 提供静态文件服务



## 代码质量保证

- 使用 ESLint 进行代码检查

- 配置 Babel 进行代码转换

- 支持 Vite 和 Vue CLI 双构建工具

- 实现热重载和开发调试功能

- 遵循 DRY 原则避免代码重复

三、为什么要使用规则文件？

可以 .CopilotCodeProrules 文件作为项目源代码的一部分，进行版本控制。
约束所有团队成员行为一致，确保团队的统一执行。
根据每个项目需求量身定制的规则和标准，实现项目的定制化规范和标准。
维护代码中的项目标准和实践，实现项目知识的沉淀和传承。

your-project/

├── .clinerules

├── src/

├── docs/

└── ...

四、如何编写有效的.CopilotCodeProrules？

在编写.CopilotCodeProrules文件时，一般要注意以下几点：

语言简单明了：使用简单无歧义的语言进行描述，能够清晰的表达意图。
结果清晰直白：重点关注所需的结果，要清晰的描述您想要的结果，而不是特定步骤。
测试和迭代：持续测试和实验的迭代优化，以边找到最适合您的工作流程的方法。

存放位置示例，如下：

your-project/\

├── .CopilotCodeProrules/ # 执行规则的文件夹\

│ ├── 01-coding.md # 核心编码规则\

│ ├── 02-documentation.md # 文档编写规范\

│ └── current-sprint.md # 当前工作的其他规则\

├── src/\

└── ...

在.CopilotCodeProrules/目录中自动处理所有标记文件，将它们组合成统一的一组规则。数字前缀（可选）有助于以逻辑序列组织文件。

五、如何管理和使用规则文件？

对于有多个上下文或团队的项目，需要对规则文件进行管理并维护成目录，方便更好的使用和管理。比如当需要上下文激活时，可以将相关文件从备份的规则库中直接复制到生效的规则文件夹中，实现快速的激活。同时分类管理，可以将规则文件清晰化，在更新规则时，不会影响到其他规则。

目录规则文件结构示例

目录规则文件结构示例，如下：

your-project/\

│ │ .CopilotCodeProrules/ # 生效规则 - 自动应用\

│ │ │ └── client-a.md\

│\

│ │ └── CopilotCodeProrules-bank/ # 可用但未生效的规则库\

│ │ │ │ └── client-a.md\

│ │ └── client-b.md\

│ │ │ └── frameworks/ # 框架特定规则\

│ │ │ │ └── react.md\

│ │ └── vue.md\

│ └── project-types/ # 项目类型标准\

│ │ │ └── api-service.md\

│ └── frontend-app.md

使用技巧

在使用规则文件时，可以遵循以下技巧：

将单个规则文件集中在特定问题上，例如编码风格或特定框架的规则。
在文件命名上，使用明确指示规则目的的描述性文件名。
在跟踪CopilotCodeProrules-bank/时，需要忽略 .CopilotCodeProrules/ 文件夹中的文件。
可以创建项目通用规则组合使用。

这样就将CopilotCodeProrules规则文件从静态文档转换为动态知识系统，更好的适应团队不断变化的上下文和要求。

使用操作界面快速管理规则

为了更轻松地管理单个 .clinerules 文件和文件夹系统，您可以通过单击 管理CopilotCodePro规则和工作流的图标，进入规则选项卡，选中某个规则文件右侧的开关，进行切换上下文和管理不同指令集的操作；这种方式以便于：

即时查看活动规则：查看当前活动的全局规则（来自您的用户设置）和工作区规则（.CopilotCodeProrules 文件或文件夹内容）。
快速切换规则：只需单击即可启用或禁用工作区 .CopilotCodeProrules/ 文件夹中的特定规则文件。此功能非常适合仅在需要时激活特定于上下文的规则（例如 react-rules.md 或 memory-bank.md）。
轻松添加/管理规则：快速创建工作区 .CopilotCodeProrules 文件或文件夹（如果不存在），或将新规则文件添加到现有文件夹。

六、在哪里快速借鉴他人的规则文件？

CopilotCodePro规则文件具备较强的适配性，目前网上有很多开源的规则文件均可参考：