從曆史上看，前端被認爲是二等公民，通常是由設計師或特别的人來實現的，他們通常不太了解編程 —— 通常是一(yī)些後台的模闆語言。早在10多年前，這并不是一(yī)個大(dà)問題，因爲一(yī)個典型的Web應用程序的大(dà)小(xiǎo)并不大(dà)，所以使用類的樣式設計已經很好了。不理想，但不是很煩人。 雖然互聯網在不斷的增長，應用程序變得越來越大(dà)，在某種程度上，人們開(kāi)始意識到CSS有一(yī)系列問題，這些問題變得越來越嚴重。

首先想讓css變得容易維護的話(huà)，一(yī)定要養成良好的編碼習慣。1. 不要出現層級太深的嵌套，否則将極其難以管理2. 将常用的樣式抽離(lí)成爲獨立的類，增強複用性，這一(yī)點可以學習Bootstrap的Utilities3. 類的命名一(yī)定要有規則的進行，亂起名會影響你維護（可以參考BEM，但更建議自己總結一(yī)個适用的規則）然後你要善用工(gōng)具，所見即所得的純Css肯定無法滿足大(dà)文件的管理，所以首推的是使用Sass等處理器（你也可以選擇Less、Stylus），它能讓你使用變量、函數、規則嵌套等語法，并輕松編譯成Css，大(dà)大(dà)提高編寫的速度（但也會提高調試的成本）。它的其中(zhōng)一(yī)個功能是将多個文件智能合并成一(yī)個文件，這肯定是你想要的。京東的代碼肯定也是從多個文件合并的。如果Scss無法做到你想要的事，還可以用PostCss這個新的工(gōng)具平台，像自動添加浏覽器兼容前綴的Autoprefixer，自定義語法，代碼壓縮、代碼排序，但這需要更多的學習相關知(zhī)識了。如果向更嚴格的管理代碼的話(huà)，建議使用Stylelint等工(gōng)具，來規範你的代碼格式。CSS并不是一(yī)種編程語言 —— 盡管引入了變量，但它沒有函數、條件和循環的功能，因此沒有辦法自動化生(shēng)成代碼。如果你基于代碼中(zhōng)的某些屬性創建類名，那麽必須在CSS代碼中(zhōng)重複所有這些屬性，這是不可避免的。對于變量來說也是一(yī)樣的，如果你需要把所有的green顔色換成稍微不同的顔色。有時候顔色可能是一(yī)樣的，但在語義上是不同的顔色（比如primary和header-title）。所有這些都導緻了預處理器的誕生(shēng)，這些語言與CSS非常相似，但具有擴展功能 —— Sass、LESS、Stylus和PostCSS。

一(yī)是使用VSCode、Atom等與Node整合的編輯器，他們可以安裝各類的插件，Sass、PostCss、Stylelint等工(gōng)具都可以與之整合。在編寫的過程中(zhōng)自動完成處理。二是使用現在業内流行的工(gōng)作流，自己安裝Node環境，使用Grunt、Gulp、Webpack等工(gōng)具來整合Sass、PostCss、Stylelint等組件，成爲定制化的，這比第一(yī)種需要更多的Node知(zhī)識，建議初學者慎用。