一、项目简介

Moran-PC项目是一款Vue2+Element-UI开发的电脑版前端项目,同时它们各自支持与Moran-Boot单体项目、Moran-Cloud微服务项目实现无缝对接

Moran-Boot源码地址:https://gitee.com/moran-team/moran-boot

Moran-Cloud源码地址:https://gitee.com/moran-team/moran-cloud

Moran-UI源码地址:https://gitee.com/moran-team/moran-ui

Moran-UI在线提问:https://gitee.com/moran-team/moran-ui/issues

Moran-UI更新日志:https://www.yuque.com/moran-spo6i/gqwa3g/qwo3tcy07m9pcb5f

Moran博客:https://blog.51cto.com/wuningfei

二、技术选型

1、系统环境
  • Node 16.2 +
  • Npm 8.9 +
2、主框架
  • Vue 2.6.10
  • Element-UI 2.13.2
3、其他插件
  • axios 0.18.1
  • vue-router 3.0.6
  • vuex 3.1.0

三、项目结构

├── public                     // 公共文件
│   ├── favicon.ico            // favicon图标
│   └── index.html             // html模板
├── src                        // 源代码
│   ├── api                    // 所有请求
│   ├── assets                 // 主题 字体等静态资源
│   ├── components             // 全局公用组件
│   ├── layout                 // 布局
│   ├── router                 // 路由
│   ├── store                  // 全局 store管理
│   ├── utils                  // 全局公用方法
│   ├── views                  // view
│   ├── App.vue                // 入口页面
│   ├── main.js                // 入口 加载组件 初始化等
│   ├── permission.js          // 权限管理
│   └── settings.js            // 系统配置
├── .editorconfig              // 编码格式
├── .env.development           // 开发环境配置
├── .env.production            // 生产环境配置
├── .env.staging               // 测试环境配置
├── .eslintignore              // 忽略语法检查
├── .eslintrc.js               // eslint 配置项
├── .gitignore                 // git 忽略项
├── babel.config.js            // babel.config.js
├── package.json               // package.json
└── vue.config.js              // vue.config.js

四、项目截图

【Moran-PC】Vue+Elment-UI电脑端开源项目_Vue

【Moran-PC】Vue+Elment-UI电脑端开源项目_Element-UI_02

【Moran-PC】Vue+Elment-UI电脑端开源项目_Element-UI_03

【Moran-PC】Vue+Elment-UI电脑端开源项目_Element-UI_04

【Moran-PC】Vue+Elment-UI电脑端开源项目_Vue_05