Posted 2021-04-26 璇泙

NG-ZORRO 鏄?Ant Design 鐨?Angular 瀹炵幇锛屼富瑕佸紑鍙戝拰鏈嶅姟浜庝紒涓氱骇鍚庡彴浜у搧銆傚洜寰俊鐨勯檺鍒讹紝浠ヤ笅閾炬帴涓庤祫鏂欒鐐瑰嚮闃呰鍘熸枃杩涜鏌ョ湅銆?/span>

10涓湀涔嬪墠鎴戜滑鍙戝竷浜?NG-ZORRO 鐨勭涓€涓増鏈紝鍦ㄨ繖 10涓湀鐨勬椂闂撮噷锛屾垜浠帴鏀朵簡瓒呰繃 35 涓?contributor 鐨?nbsp;386 娆?Commit銆?/p>

鍦ㄧ粡杩囦簡 35 涓増鏈?span data-type="ranges"> 鐨勮凯浠ｄ箣鍚庯紝1.0 鐗堟湰缁堜簬姝ｅ紡鍙戝竷 馃帀銆?/span>

1.0 鐗堟湰鍩轰簬鏈€鏂扮殑 Angular ^6.0.0 涓?RxJS ^6.0.0 鏋勫缓锛屼笌 @angular/cli 杩涜浜嗘繁搴︽暣鍚堬紝瀹屽杽浜嗘枃妗ｇ郴缁燂紝闄嶄綆浜嗕笂鎵嬮毦搴︼紝鍚屾浜嗘渶鏂扮殑璁捐瑙勮寖銆傞櫎姝や箣澶栵紝鎴戜滑瀹屾垚浜嗕笌 Ant Design 鎵€鏈夌粍浠讹紙鍏?1涓級鐨勫畬鍏ㄥ悓姝ュ伐浣滐紝骞跺涔嬪墠鐨勯儴鍒嗙粍浠惰繘琛屼簡閲嶆瀯銆?/span>

鏈€閲嶈鐨勬槸锛岃繖浜涘伐浣滅浉瀵逛簬涓婁竴涓増鏈紙0.7.1锛夋病鏈?span class="mq-14">寮曞叆浠讳綍鐮村潖鎬ф洿鏂?/span>锛岃繖鎰忓懗鐫€鎵€鏈変綘闇€瑕佸仛鐨勫彧鏄鍗囩骇鐩墠椤圭洰鐨?Angular 鐗堟湰鍒?6.0銆?/span>

娉細鍗囩骇鍒版渶鏂扮殑 Angular 6 鐗堟湰鍙渶瑕?span class="mq-16">寰堝皯鐨勫伐浣?/span>灏卞彲浠ュ畬鎴愶紝鍏蜂綋鐨勬楠ゅ彲浠ュ弬鑰冨畼鏂圭殑 鍗囩骇鎸囧崡锛屼篃鍙互鍙傝€冨崱鑹茬殑 ng-zorro-antd 鍗囩骇 Angular6 鎸囧紩銆?/span>

蹇€熶笂鎵?/span>

NG-ZORRO 鍦?1.0 鐗堟湰涓婂畬鏁存敮鎸佷簡 Schematics锛岀幇鍦ㄥ彧闇€瑕佸湪鏂板缓鐨?angular 椤圭洰涓墽琛屼互涓嬪懡浠ゅ氨鍙互蹇€熷畬鎴愬叏閮ㄩ厤缃€?/p>

ng add ng-zorro-antd

鑷畾涔変富棰樺拰璁惧畾鍥介檯鍖栬瑷€涔熷彲浠ラ€氳繃鍦ㄥ垵濮嬪寲鏃跺鍔?nbsp;--theme 鍜?nbsp;--i18n 鐨勯€夐」鏉ュ畬鎴愩€?/span>

闄や簡鍒濆鍖栭」鐩互澶栵紝1.0 鐗堟湰杩樻敮鎸佷唬鐮佸揩閫熺敓鎴愶紝鍦ㄩ」鐩腑鎵ц浠ヤ笅鍛戒护灏卞彲浠ュ揩閫熺敓鎴愪竴涓櫥褰曟缁勪欢銆?/p>

ng g ng-zorro-antd:form-normal-login -p app --styleext='less' --name=login

鏇村鐨勯厤缃俊鎭彲浠ュ湪 鏂囨。 涓繘琛屾煡鐪嬨€?/p>

鎴戜滑鍑嗗浜嗛儴鍒嗛」鐩疄鎴樻潵甯姪浣犲叆闂?ng-zorro-antd 鍜?Angular锛屽悗缁細鍦?nbsp;璇泙 涓€愭鏀惧嚭锛屾杩庡叧娉ㄣ€?/p>

璁捐浣撶郴

鍦?1.0 鐗堟湰鎴戜滑浣跨敤浜?nbsp;bot 涓?Ant Design 璁捐浣撶郴杩涜鐗堟湰鍚屾锛屼繚璇佷簡 Ant Design 鐨勬捣閲忚璁＄墿鏂欑殑瀹屽叏鍙敤銆?/p>

杩欐剰鍛崇潃鏃犺鏄娇鐢?nbsp;Ant Design Libraray 杩樻槸 Ant UX 璁捐鐨勯〉闈紝閮藉彲浠ヤ娇鐢?nbsp;ng-zorro-antd 瀹岀編鐨勮繘琛岃繕鍘熴€?/span>

闄ゆ涔嬪锛屾垜浠湪 1.0 鐗堟湰涓鍔犱簡css鐨勬牱寮忔枃浠剁殑杈撳嚭锛?瀹屽杽浜嗚嚜瀹氫箟涓婚鐨勬柟寮忥紝鐜板湪鏃犺浣犳兂浣跨敤鍝竴绉?css 棰勫鐞嗗櫒锛宯g-zorro-antd 鐨勬牱寮忚嚜瀹氫箟鏂囦欢閮藉彲浠ヤ笌涔嬪吋瀹广€?/p>

浠ｇ爜閲嶆瀯

1.0 鐗堟湰鍦ㄥ浠ｇ爜閲嶆瀯鐨勫悓鏃朵繚璇佷簡瀵逛笂涓増鏈殑瀹屽叏鍏煎銆?/span>

Tooltip銆丳opover銆丳opConfirm绛夌粍浠跺湪1.0鐗堟湰涓帹鑽愪娇鐢?Directive 鏂瑰紡锛屽師鏈夌殑鏂瑰紡铏界劧涓嶆帹鑽愶紝浣嗘槸浠嶇劧鍙互缁х画浣跨敤銆傚彟澶栵紝鍊熷姪浜?Angular 6.0鐨勬柊鐗规€э紝forRoot灏嗕笉鍐嶅繀瑕侊紝鍦ㄤ换浣?module 閮藉彲浠ョ洿鎺ュ紩鍏?nbsp;NgZorroAntdModule锛屽綋鐒跺師鏈夌殑forRoot鐨勬柟寮忎篃浼氱户缁吋瀹广€?/span>

姝ゅ锛宯g-zorro-antd 鐨勬墍鏈夌涓夋柟渚濊禆锛堥櫎鍘?@angular 鍖呬箣澶栧彧鏈?date-fns锛夐兘鏀寔 Tree Shaking锛岃繖鎰忓懗鐫€鐢ㄦ埛鍙渶鏀惧績瀵煎叆 NgZorroAntdModule 锛屾湭浣跨敤鐨勭粍浠跺湪鎵撳寘鍚庡皢浼氳鑷姩瑁佸壀銆?/p>

寮曞叆 ng-zorro-antd 鍏ㄩ儴 module 鍚庣殑 Hello World 绋嬪簭 gzip涔嬪悗鏁翠釜椤圭洰浠呮湁 131.18 KB

浠ｇ爜璐ㄩ噺

鎴戜滑鍦?1.0 鐗堟湰涓寮轰簡瀵硅川閲忕殑鎶婃帶銆?code class="mq-58">ng-zorro-antd 鐨勬祴璇曠敤渚嬭繘涓€姝ュ鍔犲埌 1115 涓紝鏁翠綋鐨勬祴璇曡鐩栫巼鎻愰珮鍒颁簡 95% 浠ヤ笂銆?/span>

闄や簡鍗曞厓娴嬭瘯浠ュ锛岀洰鍓嶈繍琛屽湪鎴戜滑鐨勬寔缁泦鎴愪笂鐨勮繕鏈?nbsp;webpack 銆?code class="mq-63">rollup 涓?nbsp;@angular/cli 涓夊鐜锛岃繖鎰忓懗鐫€鏃犺浣犺嚜宸辨瀯寤虹幆澧冭繕鏄娇鐢ㄥ畼鏂圭殑寮€鍙戝浠堕兘鍙互寰楀埌鏇村ソ鐨勮川閲忎繚闅溿€?/span>

鎵€鏈夋寔缁泦鎴愮殑杩愯缁撴灉閮藉彲浠ラ殢鏃跺湪 Travis CI 杩涜鏌ョ湅銆?/p>

鍦ㄧ嚎鏂囨。

鍦?1.0 鐗堟湰鐨勫湪绾挎枃妗ｄ腑锛屾垜浠鍔犱簡姣忎釜缁勪欢鐨勭被鍨嬩俊鎭紝骞朵负鍏ㄩ儴鐨勫彲鐢ˋPI鏇存竻鏅扮殑鏍囨槑浜嗗睘鎬с€傛瘡涓唬鐮佺ず渚嬪睍寮€鍚庨兘鍙互鍦?stackblitz 涓婄洿鎺ュ揩閫熺紪杈戙€傚彟澶栫洰鍓嶇殑鏂囨。绯荤粺瀹屽叏鐢眒arkdown鐢熸垚锛屽ぇ瀹跺彲浠ラ€氳繃鐐瑰嚮鏂囨。涓殑缂栬緫鎸夐挳蹇€熸彁鍑哄鏂囨。鐨勪慨鏀瑰缓璁€?/p>

鍐欏湪鏈€鍚?/span>

鐩墠 ng-zorro-antd 宸茬粡鏈夋潵鑷秴杩?50 涓浗瀹舵瘡鏈?2w 浠ヤ笂鐨勬椿璺冪敤鎴凤紝鎰熻阿鎵€鏈夌敤鎴峰鎴戜滑鐨勪俊浠伙紝鎴戜滑涓€鐩磋嚧鍔涗簬鎻愪緵缁?Angular 寮€鍙戣€呮彁渚涙剦鎮︾殑寮€鍙戜綋楠屻€?/span>

涓轰簡鏇村ソ鐨勬敮鎸佷娇鐢?ng-zorro-antd 鐨勭敤鎴凤紝鎴戜滑鍑嗗浜嗙敤鎴疯嚜鍔╂湇鍔＄兢

鍦ㄥ畼缃戜腑寮€鍚?Chrome DevTools 鍙互鐪嬪埌閽夐拤缇ゅ姞鍏ユ柟寮?/p>

鏈€鍚庢劅璋㈡墍鏈夌殑 contributor锛屾劅璋㈠ぇ瀹躲€?/p>

閾炬帴

• 瀹樻柟缃戠珯锛欰nt Design Of Angular

• 鍥藉唴闀滃儚锛欰nt Design Of Angular

• 璁捐瑙勮寖锛欰nt Design Design Language

• 鍩轰簬 ng-zorro-antd 涓悗鍙板墠绔В鍐虫柟妗堬細Ng Alain

• vscode 鎷撳睍锛?nbsp;ng-zorro-antd snippets

闀挎寜浜岀淮鐮佸叧娉ㄨ闆€

鑾峰彇鏇村鏈夎叮鐨勭煡璇嗚储瀵?/p>