涔嬪墠鎶奷va鍏ラ棬绯诲垪鐪嬪畬浜嗐€傚畠鍙槸涓€涓函鏁版嵁娴佹鏋讹紝鐢ㄥ畠鏉ュ紑鍙戞槸娌℃湁闂鐨勩€備絾鏄繕鏄湁涓€浜涚箒鐞愮殑姝ラ锛屾瘡娆￠兘闇€瑕佹墜鍔ㄥ畬鎴愩€傚瘎瀛樺櫒妯″瀷锛屾墜鍐欒矾鐢辫矾鐢便€俇mi缁撳悎dva鐨勫嚭鐜帮紝璁╁紑鍙戞洿鍔犱紭闆呬究鎹枫€?鐗规€ю煋﹀紑绠卞嵆鐢紝鍐呯疆react,react-router绛夝煆堢被next.js璺敱绾﹀畾锛屽姛鑳藉畬澶囷紝鏀寔閰嶇疆璺敱鏂瑰紡馃帀瀹屽杽鐨勬彃浠朵綋绯伙紝浠庢簮鐮佽鐩栨瘡涓€涓敓鍛藉懆鏈熸瀯寤轰骇鍝侌煔€楂樻€ц兘锛屾敮鎸丳WA锛岄€氳繃鎻掍欢浠ヨ矾鐢变负鍗曚綅杩涜浠ｇ爜鎷嗗垎馃拡鏀寔闈欐€侀〉闈㈠鍑猴紝閫傚簲鍚勭鐜锛屼緥濡備腑鍙颁笟鍔★紝鏃犵嚎涓氬姟锛宔gg锛屾敮浠樺疂閽卞寘锛屼簯鍑よ澏锛岀瓑馃殑寮€鍙戜笂鎵嬪揩锛屾敮鎸佷竴閿墦寮€dll鍜宧ard-source-webpack-plugin绛夝煇犱竴閿吋瀹笽E9锛屽熀浜巙mi-plugin-polyfills馃崄瀹岀編鐨凾ypeScript鏀寔锛屽寘鎷琩.ts瀹氫箟浠ュ強umi娴嬭瘯馃尨涓巇va鏁版嵁娴佹繁搴︽暣鍚堬紝鏀寔duck鐩綍锛屾ā鍨嬭嚜鍔ㄥ姞杞斤紝浠ｇ爜鎷嗗垎绛夈€?浣跨敤鑴氭墜鏋?.瀹夎uminpminstall-gumi2銆傛鏌mi-v3銆傚畨瑁呰剼鎵嬫灦npminstall-gcreate-umi4銆備娇鐢ㄨ剼鎵嬫灦鍒濆鍖栭」鐩甤reate-umi閫夋嫨>project锛岀劧鍚庨€夋嫨dependencies銆傛湰璇惧厛閫夋嫨antd锛屼笉閫夋嫨dva銆?.杩愯椤圭洰锛岃繘鍏ラ」鐩洰褰曪紝鍏堝畨瑁呬緷璧栵紝鐒跺悗杩愯npminstallnpmstart6銆傚鏋滄祻瑙堝櫒璁块棶椤虹晠锛屽湪娴忚鍣ㄤ腑鎵撳紑http://localhost:8000锛屽彲浠ョ湅鍒板涓嬬晫闈€?绾﹀畾鐩綍浠嬬粛鑴氭墜鏋惰嚜鍔ㄧ敓鎴愪竴浜涚洰褰曪紝闇€瑕佹寜鐓х害瀹氱殑鏂瑰紡缂栧啓锛寀mi澶嶆潅搴旂敤姝ｅ父杩愯鐨勭洰褰曠粨鏋勫涓嬶細.鈹溾攢鈹€dist///榛樿鏋勫缓杈撳嚭鐩綍鈹溾攢鈹€鈹€mock///mock鏂囦欢鎵€鍦ㄧ洰褰曪紝鏍规嵁express鈹溾攢鈹€config/鈹溾攢鈹€config.js//umi閰嶇疆锛屽悓.umirc.js锛屼袱鑰呬簩閫変竴鈹斺攢鈹€src///婧愮洰褰曪紝鍙€夆敎鈹€鈹€layouts/index.js//鍏ㄥ眬甯冨眬鈹溾攢鈹€pages///椤甸潰鐩綍锛岄噷闈㈢殑鏂囦欢鏄矾鐢扁敎鈹€鈹€.umi///dev涓存椂鐩綍锛岄渶瑕佸姞鍏?gitignore鈹溾攢鈹€.umi-production///寤虹珛涓存椂鐩綍锛屼細鑷姩鍒犻櫎鈹溾攢鈹€document.ejs//HTML妯℃澘鈹溾攢鈹€404.js//404椤甸潰鈹溾攢鈹€page1.js//绗?椤碉紝浠绘剰鍛藉悕锛屽鍑簉eact缁勪欢鈹溾攢鈹€page1.test.js//鐢ㄤ緥鏂囦欢锛寀mitest浼氬尮閰嶆墍鏈変互.test.js鍜?e2e.js缁撳熬鐨勬枃浠垛敂鈹€鈹€page2.js//page2锛屼换鎰忓懡鍚嶁敎鈹€鈹€global.css//绾﹀畾鐨勫叏灞€鏍峰紡鏂囦欢锛岃嚜鍔ㄥ鍏ワ紝鎴栬€単lobal.less鈹溾攢鈹€global.js//杩欓噷鍙互娣诲姞polyfill鈹溾攢鈹€.umirc.js//umi閰嶇疆,鍚宑onfig/config.js,涓よ€呴€夊叾涓€鈹溾攢鈹€.env//鐜鍙橀噺鈹斺攢鈹€package.json鏁查粦鏉匡紝鐭ヨ瘑鐐癸細umi鏄寜椤甸潰鍒掑垎鐨勶紝姣忎釜椤甸潰鍙湁鑷繁鐨刴odel銆乻ervice銆乽til绛変笉鍍廳va鐨勭洰褰曠粨鏋勶紝鎵€鏈夋ā鍨嬨€佹湇鍔°€侀〉闈㈢粺涓€绠＄悊銆傝繖鍙栧喅浜庝綘鍠滄浠€涔堟牱鐨勭鐞嗛鏍笺€俤ist榛樿鐨勮緭鍑鸿矾寰勫彲浠ラ€氳繃閰嶇疆outputPath鏉ヤ慨鏀广€俶ock鍚堢害mock鐩綍涓嬬殑鎵€鏈?js鏂囦欢閮戒細琚В鏋愪负mock鏂囦欢銆傛瘮濡傛柊寤轰竴涓猰ock/users.js锛屽唴瀹瑰涓嬶細exportdefault{'/api/users':['a','b'],}鐒跺悗璁块棶http://localhost:8000/api/鐢ㄦ埛鍦ㄦ祻瑙堝櫒涓彲浠ョ湅鍒癧'a','b']銆俿rc绾﹀畾src涓烘簮浠ｇ爜鐩綍锛屼絾鍙€夛紝绠€鍗曢」鐩彲浠ヤ笉娣诲姞src鐩綍銆備緥濡傦細涓嬮潰涓や釜鐩綍缁撴瀯鐨勬晥鏋滄槸涓€鑷寸殑銆俿rcpagesindex.jslayoutsindex.js.umirc.jspagesindex.jslayoutsindex.js.umirc.jssrc/layouts/index.js鍏ㄥ眬甯冨眬鍏跺疄灏辨槸璺敱涔嬪鐨勪竴灞傘€傛瘮濡備綘鐨勮矾鐢辨槸锛歔{path:'/',component:'./pages/index'},{path:'/users',component:'./pages/users'},]濡傛灉鏈夊竷灞€/index.js锛屽垯璺敱鍙樹负锛歔{path:'/',component:'./layouts/index',routes:[{path:'/',component:'./pages/index'},{path:'/users',component:'./pages/users'},]}]src/pages鍚屾剰鎵€鏈?j|t)sx?椤甸潰涓嬬殑鏂囦欢鏄矾鐢便€傛湁鍏冲父瑙勮矾鐢辩殑鏇村浠嬬粛锛岃杞埌璺敱绔犺妭銆俿rc/pages/404.js404椤甸潰銆傛敞鎰忥紝鍦ㄥ紑鍙戞ā寮忎笅锛寀mi鍐呯疆浜嗕竴涓?04鎻愮ず椤甸潰锛屾墍浠ヤ綘鍙兘閫氳繃鏄惧紡璁块棶/404鏉ヨ闂繖涓〉闈€傚綋src/pages/document.ejs鏈夎繖涓枃浠舵椂锛屽畠浼氳鐩栭粯璁ょ殑HTML妯℃澘銆傝嚦灏戝簲璇ュ寘鍚涓嬩唬鐮侊紝
