小而精的Vue管理系统,不后悔系列

豆芽菜Geek · · 491 次点击 · · 开始浏览    
这是一个创建于 的文章,其中的信息可能已经有所发展或是发生改变。

vue-system-admin

在线体验地址

仓库地址

预览图

登录页

screen01.png

主面板

screen02.png

基本表格

screen03.png

基本表单

screen04.png

表单详情

screen05.png

markdown编辑器

screen06.png

文件上传

screen07.png

charts图标

screen08.png

说明

各位同行如果觉得这个项目还阔以的话,可以给我点个”☆“,三克油。

本项目会一直更新下去,一直开源。

原来一直是使用的是别人的Vue管理系统,可是又觉得与其用别人的东西,自己还不如花点时间和精力去开发一套自己的管理系统,并且切合着实际的项目经验去使用各个组件,这才有了vue-system-admin的诞生,小而精,小而全,才是我的初衷。而随着经验和场景的增加,也会不断的去使用更多好用的经验和技巧。本项目使用的数据都是静态数据,尚未发送请求获取数据。当前项目会写一个电子版的文档出来。当前本项目仅仅在登录的时候使用了真实的接口,不用担心,注意后面的小彩蛋哦。

技术栈

Vue2.6.11 + ElementUI2.13.2 + vue-router3.4.3 + echarts4.8.0 + v-charts1.19.0 + mavon-editor2.6.17

项目结构

  • 登录
  • 基本表格
  • 基本表单
  • 表单详情
  • markdown编辑器
  • 文件上传
  • charts图表
  • 发送请求
  • axios封装
  • API封装
  • 未完待续

克隆项目

git clone https://github.com/FTLLOVE/vue-system-admin.git

依赖安装

yarn install or npm install

编译启动项目

yarn serve or npm run serve

打包部署

yarn build or npm run build

小彩蛋

后面会有实战项目,一点一滴的编写一个项目。不仅仅有前端,还有后端,而后端会采用不同的语言,比如Java,PHP, NodeJS, Golang。当前前端也会有不同的项目,比如使用React打造的轻量简洁的中后台管理系统。使用NextJS,NuxtJS等技术开发不同技术栈的非SPA项目。

如果你觉得这就没了,那可能让你失望了,每个项目都会有配套的电子版的文档发布出来,


有疑问加站长微信联系(非本文作者)

本文来自:简书

感谢作者:豆芽菜Geek

查看原文:小而精的Vue管理系统,不后悔系列

入群交流(和以上内容无关):加入Go大咖交流群,或添加微信:liuxiaoyan-s 备注:入群;或加QQ群:701969077

491 次点击  
加入收藏 微博
暂无回复
添加一条新回复 (您需要 登录 后才能回复 没有账号 ?)
  • 请尽量让自己的回复能够对别人有帮助
  • 支持 Markdown 格式, **粗体**、~~删除线~~、`单行代码`
  • 支持 @ 本站用户;支持表情(输入 : 提示),见 Emoji cheat sheet
  • 图片支持拖拽、截图粘贴等方式上传