高性能方案實現ant-design在運行時動態改變主題色(利用webpack-theme-color-replacer)

今天利用webpack-theme-color-replacer插件,爲ant-design實現了在運行時動態切換主題色的功能,無需在頁面進行less的編譯,提高了切換速度。有須要的同窗能夠參考下。webpack

源碼git

效果預覽。在右側中央的配置按鈕點開能夠切換主題色。github

實現方案:

方案是統一的,見以前的文章web

基本步驟:

基於 ant-design-pro 這個項目上進行修改:segmentfault

一、webpack加入插件配置:查看修改less

二、運行時動態切換主題色,查看修改spa

實現效果:

初始主題色:

clipboard.png

切換後主題色:

clipboard.png

相關文章
相關標籤/搜索