介绍
mb-admin 是一个基于 element-plus 免费开源的中后台模版。使用了最新的vue3,vite,TypeScript等主流技术开发,开箱即用的中后台前端解决方案,可以用来作为项目的启动模版,也可用于学习参考。并且时刻关注着最新技术动向,尽可能的第一时间更新。
mb-admin 的定位是后台集成方案,不太适合当基础模板来进行二次开发。因为集成了很多你可能用不到的功能,会造成不少的代码冗余。如果你的项目不关注这方面的问题,也可以直接基于它进行二次开发。
特性
- 最新技术栈:使用 Vue3 + vite5 + vueRouter + pina 等前端前沿技术开发
- TypeScript: 应用程序级 JavaScript 的语言
- 主题: 可配置的主题
- 自定义数据 内置 Mock 数据方案
- 权限 内置完善的动态路由权限生成方案
- 组件 二次封装了多个常用的组件
- 示例 内置丰富的示例
预览
在线预览(国际地址)👈
在线预览(国内地址)👈
帐号密码:admin / admin
官方文档
官方文档(国际地址)👈
官方文档(国内地址)👈
前序准备
- node 和 git - 项目开发环境
- Vite - 熟悉 vite 特性
- Vue3 - 熟悉 Vue 基础语法
- TypeScript - 熟悉
TypeScript基本语法 - Es6+ - 熟悉 es6 基本语法
- Vue-Router-Next - 熟悉 vue-router 基本使用
- Element-Plus - element-plus 基本使用
- Mock.js - mockjs 基本语法
- UnoCSS - 熟悉 UnoCSS 即时按需原子 CSS 引擎
安装和使用
- 获取代码
git clone https://github.com/syh-micro-build/mb-admin.git
- 安装依赖
cd mb-admin
npm install
npm run prepare
- 运行
npm run dev
- 打包
# 开发环境
npm run build dev
# 测试环境
npm run build test
# 生产环境
npm run build pro
- 打包后预览
# 开发环境
npm run preview dev
# 测试环境
npm run preview test
# 生产环境
npm run preview pro
- 提交代码
git add .
npx cz
- 版本更新
npm run release
- 项目依赖更新
npx npm-check-updates -i --format
更新日志
如何贡献
你可以提一个 issue 或者提交一个 Pull Request。
Pull Request:
- Fork 代码
- 创建自己的分支:
git checkout -b feat/xxxx - 提交你的修改:
git commit -am 'feat(function): add xxxxx' - 推送您的分支:
git push origin feat/xxxx - 提交
pull request
Git 贡献提交规范
feat: ✨ 新增功能 | A new feature'fix: 🐛 修复缺陷 | A bug fix'docs: 📝 文档更新 | Documentation only changes'style: 💄 代码格式 | Changes that do not affect the meaning of the code'refactor: ♻️ 代码重构 | A code change that neither fixes a bug nor adds a feature'perf: ⚡️ 性能提升 | A code change that improves performance'test: ✅ 测试相关 | Adding missing tests or correcting existing tests'build: 📦️ 构建相关 | Changes that affect the build system or external dependencies'ci: 🎡 持续集成 | Changes to our CI configuration files and scripts'chore: 🔨 其他修改 | Other changes that do not modify src or test files'revert: ⏪️ 回退代码 | Revert to a commit'
浏览器支持
本地开发推荐使用 Chrome 80+ 浏览器
支持现代浏览器, 不支持 IE
![]() IE | ![]() Edge | ![]() Firefox | ![]() Chrome | ![]() Safari |
|---|---|---|---|---|
| not support | last 2 versions | last 2 versions | last 2 versions | last 2 versions |
捐赠
捐赠开源,让技术照亮更多人的未来~~~
-
支付宝
-
微信
技术交流
欢迎大家加入技术交流群,探讨技术,一起进步~~~
-
qq群:415849653
-
微信群




