当前位置:   article > 正文

.net vue漂亮登录界面_这么漂亮的免费Vue后端管理界面不来试试真的可惜了——Vuestic

好看的登录页面vue

介绍

最近使用Vue方面的东西比较多,也接触了一些管理模板方面的资料,今天要介绍的就是其中一个,Vuestic Admin管理模板包括38以上个定制用户界面组件,界面也很现代化,在demo中就已经包含了中文版本,文末有多图欣赏,感兴趣的小伙伴可以直接参考demo:


84cb9d8780d5401a844da72e7a74c8ca.png

Github

目前在Github上还是非常受欢迎的,Stars数已经多大6.8k,而且在仓库中可以找到中文的介绍,这对于英文不太友好的朋友来说是很不错的:

https://github.com/epicmaxco/vuestic-admin
https://github.com/epicmaxco/vuestic-admin/blob/master/README.zh-CN.md
https://github.com/epicmaxco/vuestic-admin/wiki

为什么使用Vuestic

  • 高质量的用户界面

Vuestic实现了最佳用户界面设计思想而制作了管理模板

  • 可定制

Vuestic包括38个以上简单且可配置的组件以及7大页面

  • 响应式

Vuestic自适应支持手机、平板与电脑屏幕大小

  • 代码整洁干净

Vuestic组件跟随Vue的风格指南

  • 多浏览器支持

Vuestic支持较新的Chrome、FireFox、Safari、Edge、Opera、IE11

  • 国际化

Vuestic内置了i18n国际化解决方案

  • 免费

Vuestic代码依据MIT开源协议

安装使用

首先确保安装了以下版本的nodejs、npm以及Git环境:

  • Node.js (>=8.9)
  • npm 3+版本 (或许yarn 1.16+版本) 和Git。
#克隆存储库$ git clone https://github.com/epicmaxco/vuestic-admin.git myproject#进入应用目录与安装依赖$ cd myproject

之后,如果用npm:

$ npm install#默认情况下在localhost:8080用热重载$ npm run serve#构建生产$ npm run build#构建生产与查看包分析报表$ npm run build --report

如果用yarn:

$ yarn install#默认情况下在localhost:8080$ yarn serve#构建生产$ yarn build#构建生产与查看包分析报表$ yarn build --report

功能简介

  • 布局及图表
cea8eec9f674596fab76b408600a1cae.png
26b0073957b65d43fbb0432c303d4caa.png
8200d9044c17e324ef11f3cf597a6552.png
  • 表单
db430b7dcec6fe181c77dd3eb8b96da6.png
ea8e2de587740f5bdf25c0cfeba8bf4b.png
  • 所见即所得编辑器
0e973501b693cd5d78a469d369c519ef.png
  • 表格
dda09bd0a8bf05b71b210af88a0e032f.png
4238a1043f6efb2bd958674ee6dc2c31.png
  • 数据表格
a972554416a6a08d15bcfc43bf7f8566.png
266c95abef173903c88f7767a8b1b17d.png
d5cbef75e71321691b0b558c6bd558ab.png
1d7c466e1feb60c6ba87fa73a2f52ccd.png
095f938fd61774a4bff598a92a8351b7.png
d7b7df5b4fe24b145ff7ee41c67bfce2.png
  • 按钮
642aa337541b73fbd86951538cd6f54a.png
010916801fb2d2536555859bb0121c8a.png
f783fd081161834e65b48c179d0c6664.png
  • 卡片
e4a2f4cc2bf5acd4648ee97c13482168.png
  • 聊天框
43084d61b2ade00ecac6e52ec6dace04.png
  • 标签
336f1c8f62402facacad2a90f60925ed.png
  • 面板
e6614d29be8f912fc24929e51db2af71.png
  • 色彩
d824c9b93832ecdd8a535e4b682e05ba.png
861944d8d4c5f460f2eb66ffe76ef32e.png
  • 颜色面板
09766d1c332b3dccd7fb8eaac2f982cf.png
  • 上传组件
5d0ca319cbe1a985d1f25f9c423ad71e.png
  • Grid
9e23ef94c3ec99d47e17a68487fa7e54.png
1c88a6545869736257c152b8c2ad35ae.png
  • 图标
55ee3bd7a056eb797cfd2debc3a82b0f.png
b1e9dde18949eba03a498c93c61abbdb.png
feb423769b32b46c118ec4e22cf687d4.png
  • 列表
ed2fc269dd141d782de6fc45be08f172.png
  • 模态框
792203cf7b52bfe56059e619fdb337bb.png
  • 通知提醒
1e8cc85d5ef37fed1593323180aa07d9.png
  • 评分组件
f7f3a4fc0d0e478991e46300a481385d.png
  • Sliders
0a7e8ae89c6112a9c0b23f6bd37ebf26.png
  • Spinners
b0307df396e5598a05d43a21e8ef20c1.gif
  • Tab
5ecce686428f3a5c9a9027e497ecc8fb.png
  • 时间轴
43aff795e65f87354dce74068182468a.png
47975dd71fa4444b2590522a5265dc73.png
  • 树组件
9a71b39bd84b5bf75436593b693053a7.png
  • 登陆页面和404
6a7e1ac020abbe663d65a916aa7ad7f0.png
ddb0a5dcd2ba144bc85d4ee047556c09.png

总结

Vuestic是一个颜值很高的基于Vue的后端管理界面模板,对于颜值有追求的小伙伴一定不要错过,Enjoy it!

d97487ce060036a0edc1c603a5f1d08c.png
声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/羊村懒王/article/detail/369720
推荐阅读
相关标签
  

闽ICP备14008679号