CSS 壓縮工具

它是怎麼運作的

• 壓縮前會先解析一次樣式表，有語法錯誤就回報列號，否則 CSSO 會不發一語地丟掉出錯的規則。
• 關閉結構重組後，CSSO 只做安全的局部修改：空白、註解、顏色和數字。
• /*! 註解預設保留以符合授權要求；關閉這個選項則移除所有註解。

常見問題

結構重組安全嗎？

它的設計目標是保留原有行為：只有在 CSSO 能證明串接結果相同時，才會合併或移動規則。少數例外是依賴瀏覽器 hack，或依賴無效宣告以特定方式被忽略的樣式表。如果壓縮後的 CSS 呈現結果不同，請關閉結構重組再比較。

為什麼我的 CSS 被拒絕了？

像 color red 這樣缺少冒號的宣告，或選擇器中未關閉的括號，都是語法錯誤。瀏覽器會略過這類規則，CSSO 也會，而且毫無聲息。停下來並指出列號，代表你能修正錯誤，而不是上線一份少了你以為存在的規則的樣式表。

支援巢狀、@layer 和 @container 這類現代 CSS 嗎？

自訂屬性、@layer 和 @container 都沒問題。原生 CSS 巢狀則不行：CSSO 的解析器比它更早出現，會把巢狀規則直接丟掉，所以這個工具會以解析錯誤停止。請先把巢狀規則攤平，或交給 Lightning CSS 這類建置工具處理整個流程。

CSSO、cssnano 還是 Lightning CSS？

在一般的樣式表上，它們最後的大小相近。cssnano 是一組 PostCSS 外掛；Lightning CSS 以 Rust 撰寫，還能處理廠商前綴並將新語法降轉；CSSO 的強項則是結構合併。CSSO 的解析器沒有跟上原生巢狀這類較新的語法，如果你的樣式表用到了，這一點就很重要。

也常被稱作

• css 壓縮
• css 線上壓縮
• css 壓縮工具
• csso 線上
• css minify
• css minifier