Leafage UI

管理模板，使用 Vue 3/React、Vite、Pinia 和 Tailwind CSS构建。设计用于构建高效、响应式和快速加载的管理界面。

后台接口服务仓库： 后端服务仓库

基于 Element plus 库（branch: element）。
基于 Quasar framework 库（branch: main, develop）。
基于 Material UI 库（branch: react）。

特性

• Vue 3/React、Vite、Pinia 和 Tailwind CSS - 快速高效的开发
• 深色主题 - 现代且引人注目
• 可访问性 - 包容且用户友好
• i18n集成 - 便于全球本地化
• 响应式设计 - 自适应各种大小的设备
• 高度可定制 - 可根据项目风格定制

技术栈

开发框架：Vue3/React、TypeScript、Vite、Element-Plus/Quasar、Tailwind CSS 测试框架：Vitest 代码规范：Eslint、Husky、Lint-staged、commitlint

页面预览

light模式

dark模式

目录结构

├── public/                 # Public static assets
│   ├── icons/              # Public icons
│   ├── svgs/               # Public svgs
├── src/
│   ├── api/                # http request api
│   ├── assets/             # assets
│   ├── boot/               # plugins init
│   ├── components/         # Vue components
│   ├── constants/          # Constants
│   ├── css/                # css
│   ├── lang/               # i18n languages
│   ├── layouts/            # Layout components
│   ├── mocks/              # Mocks with msw
│   ├── pages/              # Pages
│   ├── router/             # vue router
│   ├── stores/             # Pinia
│   ├── utils/              # Utils
│   └── App.vue             # Root component
├── test/                   # Test
├── index.html              # Entry HTML file
├── .env.development        # Env for dev
├── .env.production         # Env for prod
└── postcss.config.js       # Postcss configuration
└── eslint.config.js        # Eslint configuration
└── commitlint.config.js    # Commitlint configuration
└── lint-staged.config.js   # Lint staged configuration
└── quasar.config.ts        # Vite configuration
└── vitest.config.ts        # Vitest configuration