新年後的第一篇博客，祝大家新年快樂。因爲之前使用ant.design的中後臺解決方案ant design pro感覺ant design pro的設計和交互非常漂亮。ant design + dva + umi的體驗也非常好。像ant design pro這種方案化的vue中後臺解決方案不是很多，所以在春節期間我開發了一個vue版本的中後臺方案。時間有點兒倉促還沒來得及優化。vue-admin-pro的目標就是完完整整的使用vue+nuxtjs+vuex來仿製ant design pro的風格。因爲ant design pro的風格設計非常好。
vue-admin-pro
github地址: https://github.com/gmars/vue-admin-pro
介紹
vue-admin-pro是一個企業中後臺的前端解決方案。該方案使用了vue、nuxtjs。在設計上的參考目標是阿里使用ant design設計的ant design pro。在線查看地址(不要用手機瀏覽器)http://vueadmin.sikukeji.com
安裝使用
首先clone該代碼庫到本地
git clone https://github.com/gmars/vue-admin-pro.git
然後運行
cd vue-admin-pro
yarn install
運行項目
yarn dev
瀏覽
在瀏覽器中輸入 http://localhost:3000 就可以訪問
目錄結構
|-components 封裝的組件目錄
|-pages 頁面組件
|-plugins 第三方組件的配置在該項目中使用了element-ui和axios
|-layouts 佈局和公共頁面組件
|-store 基於vuex的狀態管理
|-utils 工具函數等
依賴
"@nuxtjs/axios": "^5.0.0",
"@nuxtjs/style-resources": "^0.1.1",
"cross-env": "^5.2.0",
"echarts": "^4.2.0-rc.2",
"element-ui": "^2.4.6",
"less": "^3.9.0",
"less-loader": "^4.1.0",
"nuxt": "^2.0.0",
"v-charts": "^1.19.0"
截屏
