# cursor-demo **Repository Path**: yuyingqianduan/cursor-demo ## Basic Information - **Project Name**: cursor-demo - **Description**: 完全使用cursor代码编程 - **Primary Language**: Unknown - **License**: MIT - **Default Branch**: master - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 0 - **Forks**: 0 - **Created**: 2025-02-28 - **Last Updated**: 2025-03-15 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README # Vue3 + TS + Vite H5模板 一个基于 Vue3、TypeScript、Vite 的 H5 项目模板，集成了代码规范、提交规范、样式规范、多环境打包等最佳实践。 ## 技术栈 - Vue3 - TypeScript - Vite - Vant - Pinia - Less - PostCSS ## 特性 - ✨ Vue3 + TypeScript + Vite - 📱 移动端适配（vw/vh + flex布局） - 🎨 Less 变量主题方案 - 📦 Vant 组件库按需引入 - 🔧 ESLint + Prettier 代码规范 - 📝 Husky + Commitlint 提交规范 - 💾 Pinia 状态管理（支持持久化） - 🌈 多环境打包配置 - 🚀 NProgress 进度条 - 🎯 normalize.css 样式重置 ## 安装依赖 ### 安装基础依赖 ```sh pnpm install vant@next normalize.css nprogress pinia pinia-plugin-persistedstate pnpm install postcss-px-to-viewport-8-plugin less -D pnpm i unplugin-vue-components/vite unplugin-vue-components/resolvers -D ``` ### 安装代码规范相关依赖 ```sh pnpm install eslint prettier @typescript-eslint/parser @typescript-eslint/eslint-plugin eslint-plugin-vue eslint-config-prettier eslint-plugin-prettier -D ``` ### 安装提交规范相关依赖 ```sh pnpm install husky lint-staged @commitlint/cli @commitlint/config-conventional -D ``` ## 项目设置 ```sh ## 安装依赖 pnpm install ## 安装 husky npx husky install pnpm install -D husky lint-staged # pre-commit hook：在提交前运行 lint-staged npx husky add .husky/pre-commit "npx lint-staged" # commit-msg hook：验证提交信息 npx husky add .husky/commit-msg "npx --no -- commitlint --edit ${1}" ## 启动项目 pnpm dev ## 构建开发环境构建 pnpm build:dev ## 构建生产环境构建 pnpm build:prod ## 代码规范检查 pnpm lint ## Git 提交规范 : 示例 git commit -m "feat: 添加登录功能" git commit -m "fix: 修复按钮样式问题" ``` ### 提交规范 type 可选值： - feat: 新功能 - fix: 修复bug - docs: 文档更新 - style: 代码格式（不影响代码运行的变动） - refactor: 重构（既不是新增功能，也不是修复bug） - test: 增加测试 - chore: 构建过程或辅助工具的变动 - revert: 回滚到上一个版本 ### 样式指南 目使用 Less 变量进行主题配置，主要变量在 `src/styles/variables.less` 中定义： ### 移动端适配 使用 `postcss-px-to-viewport` 进行移动端适配，默认设计稿宽度为 375px。在开发时直接使用 px 单位，构建时会自动转换为 vw 单位。 ### 状态管理 使用 Pinia 进行状态管理，支持数据持久化： ### 环境变量配置 项目支持多环境配置，在 `vite.config.ts` 中定义： - development: 开发环境 - production: 生产环境 可以通过 `process.env` 访问环境变量。 ### UI 组件使用 项目使用 Vant 组件库，已配置按需引入，直接使用即可： ### 基础架构 ├── src/ │ ├── assets/ # 静态资源 │ ├── components/ # 公共组件 │ ├── stores/ # Pinia 状态管理 │ ├── styles/ # 全局样式 │ ├── utils/ # 工具函数 │ ├── views/ # 页面组件 │ ├── App.vue # 根组件 │ └── main.ts # 入口文件 ├── .eslintrc.js # ESLint 配置 ├── .prettierrc # Prettier 配置 ├── commitlint.config.js # Commitlint 配置 ├── postcss.config.js # PostCSS 配置 ├── vite.config.ts # Vite 配置 └── package.json # 项目配置 ## 注意事项 1. 确保 Node.js 版本 >= 14.0.0 2. 开发时注意遵循代码规范和提交规范 3. 使用 flex 布局时优先使用预定义的样式类 4. 注意及时处理 ESLint 警告和错误 ## 接入deepseek的 api vue3+node+deepseek调用 ## License [MIT](LICENSE)