本文主要圍繞umi是什麼及其特徵、安裝應用、模板例子等四個方面內容來講解umi,希望能夠對初學者有所啟發。
一、 umi是什麼
umi是可插拔的企業級反應應用程式框架。
二、 特徵
特徵
三、 安裝應用
#安裝deps#啟動dev伺服器$ npm install -g umi
#建立應用程式
#建立頁面
$ umi generate page index
$ umi dev
控制台正常輸出結果如下:頁面顯示:
#構建並部署控制台輸出如下:$ umi build
四、 模板例子
除了前面我說的ant design之外還有乙個antd admin
如何執行這個antd admin專案呢?很簡單也就三步。
(1)轉殖專案
git clone my-project(2) 安裝依賴cd my-project
npm install(3) 執行專案
npm run start控制台顯示如下結果:
顯示的介面:
umi建立前端專案
umi建立專案 入門級別 建立src pages helloworld.js頁面,umi的預設的頁面路徑 在helloworld.js中新增jsx html js 啟動服務 umi dev 這樣就可以訪問網頁服務了 構建,路徑在dist下 umi build helloworld.js export...
用umi開發專案實戰
建立乙個空資料夾 umi study pages下面有乙個隱藏的.umi資料夾。umi dev 開啟乙個本地伺服器。umi g page user 建立乙個user頁面 根目錄下建立乙個mock資料夾 建立user.js 根目錄下建立乙個layouts資料夾,測試了乙個 也可以是layout,不能是...
umi3js 建立專案
安裝 npm i umi g專案目錄 生成頁面 生成首頁 umi g page index啟動 umi dev再建立乙個頁面about umi g page about動態路由 再建立乙個頁面users id umi g page users id 動態路由取值 export default 巢狀路...