經過工具自動替換顏色值爲相應變量，不再費眼睛了

前端在開發中，爲了方便將來顏色調整和顏色使用統一規範，每每會和設計師預約義一套色彩系統。例如 AntDesign 中有以下定義：

然而開發在 Zeplin 中拿到的樣式中顏色值每每是16進制或rgba值，研發每每須要本身去查找對應變量名。例如：

// RD 拿到的樣式
{
  border: solid 1px rgba(245, 245, 245, 0.5);
  background-color: #fafafa;
}

// RD 最終寫出來的樣式
{
  border: solid 1px fade(@gray-3, 50%);
  background-color: @gray-2;
}

在平時 RD 每每須要一個一個的去查找顏色對應的變量名，過程枯燥無味。因而寫了一個插件自動實現此功能。

先上地址：

postcss-color-variable

目前支持 在Less 和 Sass 中自動替換，而且能夠自動導入依賴的文件。

最終的實現效果以下（支持 VSCode 和 WebStorm），之後不再用費神去找顏色變量。

https://www.bilibili.com/video/BV1LQ4y1N7X5

最後貼一則字節招聘。EE 部門正在大量招聘研發。可經過二維碼和連接直接投遞簡歷。

字節跳動招聘​