使用Cursor开发VUE的环境配置

安装go扩展，即安装官方的插件；
按Ctrl+Shift+P，输入 Go:Install/Update Tools，安装所有工具（尤其是gopls）；
设置自动保存：File -> Preferences -- Settings -- Auto Save -- 设置为 onFocusChange (此项位于VS Code Settings中)；
创建根目录，并建前后端子目录
复制代码
```
your-project/
├── frontend/     # Vue项目
├── backend/      # Go项目
```
打开your-project后，会自动感知这是一个多项目的工作区

项目初始化，在AI指令面板中输入：

复制代码

创建一个 Vue 3 + TypeScript 项目，使用 Vite 作为构建工具，包含：
- Pinia 状态管理
- Vue Router 
- Element Plus UI框架
放在 frontend 目录下

后端同样处理

复制代码

初始化 Go 项目，使用 Gin 框架 + GORM，目录结构如下：
backend/
├── cmd/          # 启动入口
├── internal/     # 内部业务代码
├── api/          # 路由和DTO
├── config/       # 配置管理
└── go.mod

配置.cursorrules，这是关键一步，是让工具理解项目的核心

在项目的根目录下创建 .cursorrules文件，内容如下

复制代码

# 项目技术栈
技术栈：
  - 前端: Vue 3 + TypeScript + Vite + Element Plus + Pinia
  - 后端: Go + Gin + GORM + PostgreSQL
  - 数据库: PostgreSQL（使用 GORM）

# 默认回复规则
- 所有回复使用中文
- 复杂需求拆解成小任务，分步实现

# Go后端规范
后端目录结构：
  - api/：路由定义、请求DTO、响应DTO，不写业务逻辑
  - internal/service/：业务逻辑层
  - internal/repository/：数据访问层（DAO）
  - internal/model/：数据库模型
  - internal/middleware/：中间件（JWT、CORS等）
  - pkg/：通用工具函数

编码规范：
  - 工具函数只能放在 pkg/ 目录下
  - 数据库连接统一通过 internal/database 获取
  - Service层依赖Repository接口，不直接依赖具体实现
  - 错误处理必须显式，禁止忽略error返回值
  - API层只做参数绑定、校验和响应格式化

# Vue前端规范
前端目录结构：
  - src/views/：页面组件
  - src/components/：可复用组件
  - src/stores/：Pinia状态管理
  - src/api/：API请求封装
  - src/router/：路由配置
  - src/types/：TypeScript类型定义

编码规范：
  - 使用Composition API + <script setup>语法
  - 组件命名使用PascalCase
  - 优先使用现有组件库（Element Plus），避免重复造轮子
  - API调用统一封装在 src/api 中，不要在组件内直接写axios

有了这个文件，每次生成代码都会遵循这些规范

开始开发

生成数据库模型

复制代码

请帮我设计一个后台管理系统的数据库模型，需要：
- users 表：用户登录、基本信息
- roles 表：角色
- permissions 表：权限
使用 GORM 的 Model 定义，支持 PostgreSQL

生成CRUD代码

复制代码

请根据 User 模型，生成完整的 RESTful API：
- POST /api/users - 创建用户
- GET /api/users - 列表查询（支持分页、模糊搜索）
- GET /api/users/:id - 获取详情
- PUT /api/users/:id - 更新用户
- DELETE /api/users/:id - 删除用户

要求：
1. 使用 Gin 框架
2. 添加参数校验
3. 密码需要 bcrypt 加密
4. 遵循项目的分层架构

生成前端页面

复制代码

请根据以下用户管理需求，生成Vue页面：
- 表格展示用户列表（用户名、邮箱、角色、状态）
- 支持分页
- 支持按用户名搜索
- 弹窗表单用于新增/编辑用户
- 删除按钮带二次确认

使用 Vue 3 + Element Plus

联调API

复制代码

请帮我生成 TypeScript 的 API 调用文件，对接后端接口：
- 用户列表：GET /api/users
- 创建用户：POST /api/users
- 更新用户：PUT /api/users/:id
- 删除用户：DELETE /api/users/:id

包含完整的请求/响应类型定义

关于技巧

对于复杂功能，可以先分析，再处理代码

复制代码

第一步（分析）：
请分析用户权限校验的业务逻辑，输出关键决策点

第二步（实现）：
根据上述分析，用Go实现相同逻辑，注意：
- 使用JWT解析token
- 从Redis获取用户权限缓存
- 返回是否需要拦截的中间件函数

使用@快速引用

复制代码

@commit： 分析当前的变更，检查代码问题
@workspace: 理解整个项目的上下文
@file：xxx.go :引用特定文件

调试与修复

复制代码

报错时选中错误信息，右键 Explain Error，会：
分析错误原因
提供解决方案
自动修改代码

生成单元测试

复制代码

请为用户注册接口生成单元测试：
- 测试正常注册场景
- 测试用户名已存在
- 测试邮箱格式错误
- 使用 testify/assert 库