Vue Admin Project

一个基于 Vue 3 + JavaScript 构建的现代化管理系统模板。

技术栈

• Vue 3 - 渐进式 JavaScript 框架
• Vite - 新一代前端构建工具
• Vue Router - 官方路由管理器
• Pinia - 状态管理库
• ESLint - 代码质量检查工具
• Prettier - 代码格式化工具

项目结构

project_admin/
 public/              # 静态资源
 src/
    components/      # Vue 组件
    views/          # 页面组件
    router/         # 路由配置
    stores/         # Pinia 状态管理
    App.vue         # 根组件
    main.js         # 入口文件
 index.html          # HTML 模板
 vite.config.js      # Vite 配置
 package.json        # 项目配置

开发环境设置

安装依赖

npm install

启动开发服务器

npm run dev

构建生产版本

npm run build

预览生产构建

npm run preview

代码检查

npm run lint

代码格式化

npm run format

功能特性

• 快速开发 - 使用 Vite 构建工具，享受极速的热更新体验
• 响应式设计 - 完美适配各种设备屏幕
• 易于扩展 - 模块化设计，轻松添加新功能
• 仪表板 - 包含统计卡片和活动列表
• 现代 UI - 简洁美观的用户界面

页面说明

• 首页 (/) - 项目介绍和功能特性展示
• 关于 (/about) - 项目技术栈和详细信息
• 仪表板 (/dashboard) - 数据统计和系统概览

开发说明

项目使用 Vue 3 的 Composition API 和 Options API 混合开发模式，便于学习和使用。

状态管理使用 Pinia，提供了简单的计数器示例。

路由使用 Vue Router 4，配置了基本的页面导航。

浏览器支持

现代浏览器和 IE11+

License

MIT