👏A magical vue3 admin using vue3(script-setup) + vite2 + element-plus

Overview

vue3-admin-plus

English | 中文

vue3 admin plus provides enterprise-level development demo

A new generation admin construct using vue3(setup-script)+vite2+element-plus ,It's fast!

Use eslint+prettier+gitHooks format and verification code to improve code standardization and development efficiency

Update log

//10-08
add error log collection func

Online experience

github address

Access address

国内体验地址:http://8.135.1.141/vue3-admin-plus

github 地址: https://github.com/jzfai/vue3-admin-plus.git

Demo

---- Let's look at the loading speed and the size of the built package first.:

template-speed-analysis

template-demo

Related items

The framework is available in js, ts and plus versions

development and experience:two words Really fragrant!!!!!

Documents

-- Efforts are being made to develop documents ......

You can refer to first:documentation of vue-admin-template

The difference with vue-admin-template

1.The layout method uses flex instead of the previous float, and the float layout method is completely removed, and some layout methods are optimized.

2.Use vue3 (setup-script) to write, replace webpack with vite2, add vue3's jsx writing method, vite2 is faster, use vue3 composition instead of vue2 option api writing, easier to maintain and migrate

3.Simplified some complex logic and optimized the design method of the architecture part

Comparison of performance between vue3 and vue2

  • 41% reduction in package size

  • The initial rendering is 55% faster, the update rendering is 133% faster

  • Memory reduction 54%

  • Use Proxy instead of defineProperty to implement data responsiveness

  • Rewrite the implementation of virtual DOM and Tree-Shaking

Comparison of packaging speed between vite2 and webpack

Build Setup

# clone the project
git clone https://github.com/jzfai/vue3-admin-plus.git

# enter the project directory
cd vue3-admin-plus

# install dependency(Recommend use yarn)
yarn

# develop
yarn run dev

using the browser to open http://localhost:5001

Build

# build for dev environment
yarn run build-serve

# build for production environment
yarn run  build

Others

# preview the dev environment effect
yarn run preview:build-serve

# preview the release environment effect
yarn run preview

# code format check
yarn run lint

Extra

Architecture development is not easy. If you feel good, please give me a compliment. The architecture is still being improved. Welcome to join me in development and become Contributors together! ! ! !

Browsers support

Note: Vue3 is not supported the Internet Explorer

Modern browsers and Internet Explorer 11+.

IE / Edge
IE / Edge
Firefox
Firefox
Chrome
Chrome
Safari
Safari
Edge last 2 versions last 2 versions last 2 versions

Discussion and Communication

WeChat group

License

MIT license.

Copyright (c) 2021-present kuanghua

Issues
Releases(v1.2.0)
🚀🚀🚀vue3,vue3.0,vue,vue3.x,vue.js,vue后台管理,admin,vue-admin,vue-element-admin,ant-design,vue-admin-beautiful-pro,vab admin pro,vab admin plus主线版本基于element-plus、element-ui、ant-design-vue三者并行开发维护,同时支持电脑,手机,平板,切换分支查看不同的vue版本,element-plus版本已发布(vue3,vue3.0,vue,vue3.x,vue.js)

??????vue3,vue3.0,vue,vue3.x,vue.js,vue后台管理,admin,vue-admin,vue-element-admin,ant-design,vue-admin-beautiful-pro,vab admin pro,vab admin plus主线版本基于element-plus、element-ui、ant-design-vue三者并行开发维护,同时支持电脑,手机,平板,切换分支查看不同的vue版本,element-plus版本已发布(vue3,vue3.0,vue,vue3.x,vue.js)

good luck 10.4k Oct 14, 2021
An elegant dashboard

D2Admin is a fully open source and free enterprise back-end product front-end integration solution, using the latest front-end technology stack, javas

D2 Projects 10.9k Oct 17, 2021
🎉 A magical vue admin

vue-element-admin is a production-ready front-end solution for admin interfaces. It is based on vue and uses the UI Toolkit element-ui. vue-element-admin is based on the newest development stack of vue and it has a built-in i18n solution, typical templates for enterprise applications, and lots of awesome features. It helps you build large and complex Single-Page Applications. I believe whatever your needs are, this project will help you.

花裤衩 71.3k Oct 14, 2021
🔥基于Furion/.NET 5实现的通用管理平台。整合最新技术,模块插件式开发,前后端分离,开箱即用。集成EF Core、多租户、缓存、数据校验、鉴权、事件总线、动态API、通讯、远程请求、任务调度、gRPC等众多黑科技。代码简洁、易扩展,让开发更简单、更通用、更流行!

Admin.NET 前后端分离架构,开箱即用,紧随前沿技术 ?? 概述 基于.NET 5实现的通用权限管理平台(RBAC模式)。整合最新技术高效快速开发,前后端分离模式,开箱即用。 后台基于Furion框架,前端基于小诺Antd Vue框架。集EFCore、多租户、分库读写分离、缓存、数据校验、鉴权

zuohuaijun 5 Jul 19, 2021
A vue3 version of vue-element-admin

vue-element-admin is a production-ready front-end solution for admin interfaces. It is based on vue and uses the UI Toolkit element-ui.

Ziwen Mei 382 Oct 13, 2021
Vite2 + Vue3.0 + ant-design 2.x

vite2-vue3-admin Vite2 + Vue3.0 + ant-design 2.x 线上地址 tips:可注册成功后登入 目录树 ├─public └─src ├─api ├─assets │ ├─font │ ├─icon │ ├─img

Lwp2333 17 Oct 11, 2021
Free and Beautiful Vue 3 Admin Template

Free and beautiful Vue.js admin template with 44+ custom UI components. Developed by Epicmax. Designed by Vasili Savitski Based on Vuestic UI library.

Epicmax 8.3k Oct 18, 2021
🎉 A new generation vue3 admin template using vue3(script-setup) + vite2 + element-plus

?? A new generation vue3 admin template using vue3(script-setup) + vite2 + element-plus

kuanghua 23 Oct 10, 2021
CoreUI is an Open Source Bootstrap Admin Template.

CoreUI is an Open Source Bootstrap Admin Template. But CoreUI is not just another Admin Template. It goes way beyond hitherto admin templates thanks to transparent code and file structure. And if that's not enough, let’s just add that CoreUI consists bunch of unique features and over 1000 high quality icons.

CoreUI 11k Oct 11, 2021
Admin Null — Free Vue.js Bulma Buefy Dashboard SPA (with dark mode)

Admin Null — free Vue Bulma dashboard with dark mode Admin Null is simple, beautiful and free Vue.js Bulma Buefy admin dashboard with dark mode. Free

Viktor Kuzhelny 60 Oct 10, 2021
🚀🚀🚀Vue3,Vue3.0,Vue,Vue3.x,Vuex,Typescript,TSX,ts,vue后台管理,admin,vue-admin,vue3-admin,vue-element-admin,iooc-admin,iooc-vue-admin主线版本基于element-plus、Typescript开发维护.集成CRUD,JsonSchema、大量节省业务代码.

iooc-admin(element-plus) 演示地址(数据库五分钟重置一次) ⚡️ vue3.x + element-plus + TypeScript ⚡️ vue3.x + element-plus + TypeScript (视频) 项目地址 ⚡️ vue3.x + element-pl

Jacking 51 Jun 20, 2021
采用Vue3 + Element Plus 搭建的后台管理系统解决方案,基于vue-manage-system开源系统升级改造而成,企业级定制,注释清晰,快速上手,开箱即用。

vue-manage-system-plus 采用Vue3 + Element Plus 搭建的后台管理系统解决方案,基于vue-manage-system开源系统升级改造而成,企业级定制,注释清晰,快速上手,开箱即用。线上地址 前言 由于之前企业改用其他技术方案,所以已经好长一段时间没接触vue了

lss 31 Oct 7, 2021
使用vue3.x+vite2.x+element Plus开发的具有主题切换,自定义主题颜色,布局风格切换

vue3-admin-vite 中文 | English 简介 vue3-admin-vite 是一个免费开源的后台模版。使用了最新的vue3.x,vite2.x,Element Plus等主流技术开发,开箱即用的后台前端解决方案,也可用于学习参考。 特性 最新技术栈:使用 Vue3/vite2 等

wuufeii 18 Oct 9, 2021
vue3-element-admin后台管理系统前端解决方案

Vue3 Element Admin 简介 Vue3 Element Admin 是一个免费开源的中后台模版。基于vue3+ElementPlus+Vite开发,是一个开箱即用的中后台系统前端解决方案,它可以帮助你快速搭建企业级中后台产品原型,也可用于学习参考。 在线预览 使用文档 项目地址 git

ZSEN 30 Oct 12, 2021
Production Ready, Carefully Crafted, Extensive Vuetifty Free Admin Template 🤩

Materio - Vuetify VueJS Free Admin Template Production ready carefully crafted most comprehensive admin template Introduction If you’re a developer lo

ThemeSelection 101 Oct 17, 2021
🎉 基于 vite 2.0 + vue 3.0 + vue-router 4.0 + vuex 4.0 + element-plus 的后台管理系统vue3-element-admin

vue3-element-admin ?? 基于 Vite 2.0 + Vue3.0 + Vue-Router 4.0 + Vuex 4.0 + element-plus 的后台管理系统 简介 vue3-element-admin 是一个后台前端解决方案,它基于 vue3 和 element-plu

雪月欧巴 55 Oct 11, 2021
Restful Admin Dashboard Based on Vue and Boostrap 4

REST-ADMIN 中文文档 An Powerful Admin Dashboard based on Boostrap-Vue. Demo: http://rest-admin.genyii.com/ admin admin Please support me on https://afdian

Johnny Wu 600 Sep 30, 2021
🎉 基于 vite 2.0 + vue 3.0 + vue-router 4.0 + vuex 4.0 + element-plus + typescript 的后台管理系统vue3-element-admin-ts

vue3-element-admin-ts ?? 基于 Vite 2.0 + Vue 3.0 + Vue-Router 4.0 + Vuex 4.0 + element-plus + typescript 的后台管理系统 简介 vue3-element-admin 是一个后台前端解决方案,它基于 v

雪月欧巴 40 Oct 11, 2021
✨ ✨ ✨ A vue3 style Admin based on Vite2, vue3.0, ant-design-vue 2.x, typescript,vuex,vue-router,Efforts to update in progress...

✨ ✨ ✨ A vue3 style Admin based on Vite2, vue3.0, ant-design-vue 2.x, typescript,vuex,vue-router,Efforts to update in progress...

Vben 7k Oct 14, 2021