开源项目vuestic-admin——Vue的后端UI框架

引言

这是一个Vue的后端开箱即用UI项目框架，和之前的ReactAdmin类似，它是一个框架，也就意味着它帮你完成了很多公用的部分，你只需要在其基础上进行自己的项目扩展即可。大体上这是由Vue和bootstrap4构建的，其中还集成了很多其他的东西。

Github和官网

https://github.com/epicmaxco/vuestic-admin

https://madewithvuejs.com/vuestic-admin

https://vuestic.epicmax.co/#/admin/ui/icons/ #演示地址

需要满足的环境条件

nodejs版本至少是4.x、8.xnpm版本3+和Gitvuestic-installer（后面介绍安装）

安装

首先你得安装vue-cli3，而且是全局安装

npm install -g @vue/cli

如果你使用yarn你也可以使用它安装

yarn global add @vue/cli

然后全局安装vuestic

npm install vuestic-installer -g


使用

在安装好vuestic后，你就可以使用它进行项目创建了

＃通过vuestic-installer命令创建新项目

vuestic myproject

创建好后大致看一下目录结构（图片可能不清晰，你可以直接搭建体验）

直接通过github的仓库克隆过来

git clone https://github.com/epicmaxco/vuestic-admin.git myproject

在创建好项目之后安装相关依赖

npm install//ORyarn

启动项目

npm run serve

成功后打开localhost:8080

文档

如果你想详细的学习，你可以查看官网文档

https://github.com/epicmaxco/vuestic-admin/wik1

特点

vue.jsbootstrap4WebPack响应式布局图表(Chart.js)地图进度条漂亮的验证ui4种表单向导类型静态表和数据表登录/注册页面模板Medium编辑器Toasts, tooltips, popovers,i18n（国际化）等等（详情见文档或者自行体验）

浏览器的兼容性

浏览器兼容性，很遗憾只支持到IE11+和主流的Chrome、FireFox、Safari、Edge等

总结

目前有很多开箱即用的解决方案，还有一些仅仅是UI模板，每个解决方案都有各自的优势，我们尽可能的减少不必要的开发时间浪费，在通用的基础上在扩展，最主要的还是学习看源码，希望对大家有所帮助，谢谢！