【譯】Ant Design 3.0 駕到

時間 2019-11-16

標籤 ant design 3.0 駕到欄目自動化構建简体版

原文原文鏈接

原文地址：Announcing Ant Design 3.0

原文做者：Meck

譯文出自：掘金翻譯計劃

本文永久連接：github.com/xitu/gold-m…

譯者：木羽zwwill

校對者：Usey95、 swants

Ant Design 3.0 駕到

Ant Design 是一個致力於提高「用戶」和「設計者」使用體驗，提升「研發者」開發效率的企業中後臺設計體系。前端

14 個月前咱們發佈了 Ant Design 2.0。期間咱們收到了 200 多位貢獻者的 PR，經歷了大約 4000 個提交和超過 60 個版本react

GitHub 上的 star 數也從 6k 上升到了 20k。android

自 2015 年以來的 GitHub star 趨勢。webpack

今天，咱們很高興地宣佈，Ant Design 3.0 正式發佈了。在這個版本中，咱們爲組件和網站作了全新的設計，引入了新的顏色系統，重構了多個底層組件，加入了新的特性和優化，同時最小化不兼容的更改。這裏可查看到完整的更改日誌。ios

這是咱們的主頁：ant.design/index-cngit

全新的顏色系統

咱們的新顏色系統源於天空的啓發，由於她的包容性與咱們品牌基調一致。基於對天空色彩隨時間天然變化的觀察，對光和陰影規則的研究，咱們從新編寫了顏色算法來生成一個全新的調色板，相應的層次也進行了優化。新調色板的感官更年輕，更明亮，灰度過渡得更天然，是感性美和理性美的完美結合。此外，全部主流色值都參照了信息獲取標準。github

組件的新設計

在以前的版本中，組件的基本字體大小是 12px，咱們收到了不少來自社區的反饋，建議咱們加大字號。咱們的設計師也意識到，在大屏幕普及的今天，14px 是更合適的字體大小。所以，咱們將基本字體大小增大到了 14px，並對全部組件的尺寸進行了適配。web

組件重寫

咱們重寫了 Table 組件來解決一些歷史性問題。引入了一個新的工具 components，如今你可使用這個工具來高度定製 Table 組件，這裏有一個示例，能夠添加拖拽功能。算法

Form 組件也被從新編寫，爲表單嵌套提供更好的支持。typescript

另外一個重寫的組件是 Steps，這個重寫的 Steps 有着更簡單的 DOM 結構而且兼容到IE9。

全新的組件

這個版本，咱們新增了兩個組件， List 和 Divider。

List 組件對於文本、列表、圖片、段落和其餘數據的顯示很是方便。與第三方庫集成也很簡單，例如，您可使用 react-virtualized 來實現無限加載列表。更詳細的例子能夠參考 List 文檔。

Divider 組件可用於在不一樣的章節中分割文本段落，或者將行內文本/連接分開，如表的動態列。詳細的示例能夠參考 Divider 文檔。

全面支持 React 16 和 ES 模塊

在這個版本中，咱們增長了對 React 16 和 ES 模塊的支持。若是你正在使用 webpack 3，那麼你如今能夠經過 tree-shaking 和 ModuleConcatenationPlugin 來享受 antd 對組件的優化。若是你使用的是 babel-import-plugin，只需將 libraryDirectory 設置到 es 目錄。