开源Vue后端UI开箱即用解决方案——vuestic-admin

引言

这是一个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.x
• npm版本3+和Git
• vuestic-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
//OR
yarn

• 启动项目

npm run serve

成功后打开localhost:8080

文档

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

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

特点

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

浏览器的兼容性

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

总结

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

文章来源: https://www.toutiao.com/group/6698473775530246659/