基于vue element-ui整理了一套Web后台的基础架构代码
项目参考 vue-element-admin
目标
为解决前端开发当中部分重复性劳动力,把更多的精力放在交互上。
后台管理可以分为几个模块
- layout(整体布局)
- Header头部
- Menu菜单
- Main页面
细化Main可分为
搜索栏
工具栏
表格/图表
分页
模态框
实现
常用功能都以抽象成组件。实际开发当中只需要按照固定格式， 编写少量的配置文件即可实现页面的搭建。为开发节省了大量的 布局时间。实现敏捷式开发。
目录
│ favicon.ico
│ index.html
│ LICENSE
│ package.json
│ README.md
├─build
├─config
├─node_modules
├─src
│ │ App.vue
│ │ main.js 主入口
│ │ permission.js 全局路由守卫
│ ├─api 服务端接口文件
│ ├─assets 资源文件（包括icon）
│ │ └─icon
│ ├─components 抽象出来的组件
│ ├─mock 模拟服务端请求数据
│ ├─router 路由配置文件
│ ├─store vuex文件
│ ├─styles 全局样式集合
│ ├─utils 抽象出来的常用工具
│ └─views 模板页面
└─static 静态资源文件
search_try总结
多数都是实际开发过程当中总结出来的经验。很多场景实际上还没有覆盖， 后续会持续迭代。
准备工作
git clone git@gitee.com:gjwork/base-admin.git
安装&运行
- 推荐使用 yarn 安装，执行以下命令
yarn
yarn dev
- 如果使用 npm，可执行 npm install && npm run dev，效果一致。
