序言
每天得生活都要繼續,每天的學習不能放棄,最近開始學習下umi/dva/antd的後臺管理系統,首推自然是antd-pro了,有些朋友應該比較熟悉這個了,就不多說,直接正言介紹,下面的主線都是antd-pro的搭建;
準備
Create umi
創建antd-pro或dva項目的腳手架
dva
dva 首先是一個基於 redux 和 redux-saga 的數據流方案,
然後爲了簡化開發體驗,dva 還額外內置了 react-router 和 fetch ,
所以也可以理解爲一個輕量級的應用框架。
umi
Umi,中文可發音爲烏米,是可擴展的企業級前端應用框架。Umi 以路由爲基礎的,
同時支持配置式路由和約定式路由,保證路由的功能完備,並以此進行功能擴展。
然後配以生命週期完善的插件體系,覆蓋從源碼到構建產物的每個生命週期,
支持各種功能擴展和業務需求。
正文
1.在創建的項目文件下使用cmd運行create umi
npm create umi
2.選擇antd-pro
3.選擇ts/js(新手用js比較好)
4.用ant4?
5.進入到創建的項目中,然後用cnpm install再npm start
6.最後效果
關鍵文件
config/config.js
項目的配置文件,詳情配置請參考umi的配置頁面
內部有路由模塊:routes
src/models
dva的model的文件放置地
src/pages
業務代碼的頁面
運行流程
主要看下umi的文檔,瞭解下各個模塊所負責的