【VUE】vue后台常用模板

杨利霞

【VUE】vue后台常用模板
vue后台常用模板：
! H: X2 A7 P4 J; h9 x' L% Oelement文档: http://element-cn.eleme.io/#/zh-CN/component/installation
vue API: https://cn.vuejs.org/v2/api/
" O' x: X; P9 C/ C

以下是在下收集的三个常用的vue模板

% ~* G* S! o! |# r% g
& H2 N2 U, V. h8 _- _+ X/ `: ~: d; z1、vue-manage-system

; S# n; L7 d1 y/ i4 O
) Y4 s) X1 v6 kgit地址：https://github.com/lin-xin/vue-manage-system
线上地址： http://blog.gdfengshuo.com/example/work/#/dashboard
; M6 T6 y: M& ?! A模板如图：

6 K0 [; E' V% W% W
  W7 C3 A' Q0 l3 b/ j! i/ x. C( Y

2、vue-element-admin
git地址：https://github.com/PanJiaChen/vue-element-admin
  E* ?1 N1 N- ~  z. e国际化版本：https://github.com/PanJiaChen/vue-element-admin/tree/i18n
; @* H3 r4 E( {; e

中文线上预览：https://panjiachen.github.io/vue-element-admin/#/dashboard
7 ?  i7 i& e' r" l' {
8 U0 j& J& Z! e- r& `* M: K
  S& u( d2 A) j3 v: oIE兼容处理：参考文章
模板如图：


+ D- k% f; t$ z' w+ n

, T8 }0 p# y. l2 l5 L3、vuejs 和 element 搭建的一个后台管理界面
5 R# d9 D7 e, N& o

相关技术：
0 U9 D) x& I% @2 T5 c: q$ ^/ Svuejs2.0：渐进式JavaScript框架，易用、灵活、高效，似乎任何规模的应用都适用。
& Y* W+ w9 g. t) y: E, Delement：基于vuejs2.0的ui组件库。
; U3 d% ^9 T6 Q9 v% d6 Yvue-router：一般单页面应用spa都要用到的前端路由。
! N5 @1 |4 U% nvuex：Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。
; ]( C, q2 ?3 p4 ^% S4 T+ n
2 Y& D2 T1 ^3 C3 B0 o( b" p! U+ D+ @# n
线上地址：https://taylorchen709.github.io/vue-admin/#/login
& ^1 _2 v8 @6 ^5 P4 egit地址：https://github.com/taylorchen709/vue-admin
模板如图：


+ R. Z* r4 @" c3 h7 ?5 y使用：
$ z7 _2 u! w, u' n" Y
# V4 ?  Q2 o( i' `. m8 I/ q5 Q7 M( {
install dependencies
9 _7 G: N  Q: k- x' J" M# C  _. k/ G

npm install
serve with hot reload at localhost:8081
( U+ T' E) {) m( Z, a  l1 q; W2 p
2 t2 ?1 s( R! Z3 ~. Z: D! \5 A
: `  `- }2 o8 B) bnpm run dev
/ ]) t( x) j8 A- a9 ?) y% Vbuild for production with minification
6 X% Y9 D) t8 [( M3 R# [, w
- j; ?# J+ ~$ L9 F/ ]/ Q
npm run build


/ I. ^2 M8 ~* r9 M1 p0 Q: @" U; U4、基于Vue实现后台系统权限控制


博客地址： https://blog.csdn.net/qq_32340877/article/details/79416344
" D) j# C8 c- {9 D) s

1 H& E0 q  m4 O% _0 d; W3 ~' ?基于Vue.js 2.x系列 + Element UI 的后台系统权限控制
+ \- C$ F5 u* u9 M5 {9 b0 _

git地址：https://github.com/mgbq/vue-permission
$ f5 x  w' V; `1 X0 r, n* g线上地址：https://mgbq.github.io/vue-permission/#/dashboard/dashboard

- }7 k. W$ k: l2 w3 T0 r


- `* |- ^' |% C0 @0 y3 b9 ]; o" k————————————————
; ~" r( y( l" \6 \0 _: U2 D0 b3 T版权声明：本文为CSDN博主「LuviaWu」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/LuviaWu/article/details/89212051
. W, X$ h5 ]) d7 {! a; C

& ~; y7 j( j% V4 M( I