有同學回饋啟動報錯,應該是npm 依賴的問題
我的版本資訊附上,供參考,但以上版本應該都支持
更新:
主分支master 更新為動態載入選單:
根據使用者的權限,動態分配載入選單,主要透過使用addRoutes,meta,等特性實現
展示資料透過mock.js 構造
Demo 位址
後端研發一枚,新創公司,目前沒有web端開發,逐步需要做維,經營的頁面,想要快速開展工作,
就去了解了下目前比較火的,react 、vue 、angular,對比之後,感覺目前vue是最合適的,
去官網熟悉了一下,寫了幾個demo,就開始做這個後台,借鏡很多github上的優秀作品,自己也
輸出一下,也方便自己回顧
專案為SPA,前後端分離,前端使用vue-cli構建,認證使用JWT,後端資料庫為mongodb,後端提供
restful接口,統計功能非常方便,在前端封裝好aggregate,mapReduce,條件,
類似前端組裝好查詢條件,後端直接吐對應的結果。
# install dependencies
npm install
# serve with hot reload at localhost:8080
npm run dev
# 发布测试环境 包含 webpack ananalyzer
npm run build:sit-preview
# 构建生成环境
npm run build:prod
├── build // 构建相关
├── config // 配置相关
├── src // 源代码
│ ├── api // 所有请求
│ ├── assets // 主题 字体等静态资源
│ ├── components // 全局公用组件(及页面)
│ ├── config // 配置项
│ ├── directive // 全局指令
│ ├── filtres // 全局filter
│ ├── mock // mock数据
│ ├── router // 路由
│ ├── store // 全局store管理
│ ├── styles // 全局样式
│ ├── utils // 全局公用方法
│ ├── App.vue // 入口页面
│ └── main.js // 入口 加载组件 初始化等
├── static // 第三方不打包资源
├── .babelrc // babel-loader 配置
├── .editorconfig // 代码风格文件,前提是要你的编辑器支持
├── .gitignore // 用于Git配置不需要加入版本管理的文件
├── .postcssrc.js // autoprefixer的配置文件
└── package.json // 项目依赖管理
登入認證(目前基於JWT,)todo 支援Oauth2,支援第三方登入
應用概況Dashboard 各種圖示統計
資料趨勢:註冊用戶,活躍用戶,用戶關係,等
用戶管理目前只做了查詢
數據維護支援視頻,圖片的查看
已完成折疊導覽列
已完成登入取得使用者暱稱
已完成統計圖示抽取
已完成接取阿里雲OSS,STS(臨時認證服務)
已完成支援影片播放
vuex狀態管理(目前只記錄了使用者token資訊)
[] Dashboard中的echart圖標,組件化重構(第一次使用時,寫的,程式碼比較冗餘,後續拆成組件)
404頁面元件(目前空白),考慮使用自己部落格上的騰訊公益
[] 401頁面元件
[] 響應式,支援手機
Dashboard 頁面使用了vue-echarts-v3元件,是剛開始熟悉vue時,硬擼出來的,無美感可言啊。後面逐步熟悉及應用起來組件的思想才,
程式碼尚需逐步優化,哈哈