md-admin-element-plus
md-admin-element-plus copied to clipboard
MDAdmin of element-plus
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
Mocking up web app with MDAdmin(speed)
English | 简体中文
Features
-
🗂 File based routing
-
📦 Components auto importing
-
📑 Layout system
-
🎨 UnoCSS - the instant on-demand atomic CSS engine
-
🔥 Use the new
<script setup>syntax -
🤙🏻 Reactivity Transform enabled
-
📥 APIs auto importing - use Composition API and others directly
-
🦾 TypeScript, of course
Pre-packed
UI Frameworks
- Element Plus - A Vue.js 3 UI Library made by Element team
- UnoCSS - The instant on-demand atomic CSS engine.
Icons
- Iconify - use icons from any icon sets 🔍Icônes
- Pure CSS Icons via UnoCSS
Plugins
- Vue Router
vite-plugin-pages- file system based routingvite-plugin-vue-layouts- layouts for pages
- Pinia - Intuitive, type safe, light and flexible Store for Vue using the composition api
unplugin-vue-components- components auto importunplugin-auto-import- Directly use Vue Composition API and others without importing- VueUse - collection of useful composition APIs
Coding Style
- Use Composition API with
<script setup>SFC syntax - ESLint with @antfu/eslint-config, single quotes, no semi.
Dev tools
- TypeScript
- pnpm - fast, disk space efficient package manager
- VS Code Extensions
- Vite - Fire up Vite server automatically
- Volar - Vue 3
<script setup>IDE support - Iconify IntelliSense - Icon inline display and autocomplete
- ESLint
Try it now!
md-admin requires Node >=14
GitHub Template
Create a repo from this template on GitHub.
Clone to local
If you prefer to do it manually with the cleaner git history
npx degit hminghe/md-admin-element-plus md-admin
cd md-admin
pnpm i # If you don't have pnpm installed, run: npm install -g pnpm
Checklist
When you use this template, try follow the checklist to update your info properly
- [ ] Change the author name in
LICENSE - [ ] Change the title in
.env - [ ] Change the favicon in
public - [ ] Clean up the READMEs and remove routes
And, enjoy :)
Usage
Development
Just run and visit http://localhost:3333
pnpm dev
Build
To build the App, run
pnpm build
And you will see the generated file in dist that ready to be served.








