CSS 压缩

它是怎么工作的

• 压缩前会先完整解析一遍样式表，有语法错误就报出行号，否则 CSSO 会一声不吭地把出错的规则丢掉。
• 关掉结构优化后，CSSO 只做安全的局部改动：空白、注释、颜色和数字的缩写。
• /*! 注释默认保留以满足许可证要求；关掉这个选项会删除所有注释。

常见问题

结构优化安全吗？

它的设计目标是不改变效果：只有在 CSSO 能证明层叠结果不变时，才会合并或移动规则。少数例外是依赖浏览器 hack、或依赖无效声明以特定方式被忽略的样式表。如果压缩后显示不一样，关掉结构优化再对比。

为什么我的 CSS 被拒绝了？

像 color red 这样少了冒号的声明，或者选择器里没闭合的括号，都是语法错误。浏览器会跳过这类规则，CSSO 也会，而且悄无声息。直接报出行号，你就能修好错误，而不是上线一份少了规则却浑然不知的样式表。

支持原生嵌套、@layer 和 @container 这些新写法吗？

自定义属性、@layer 和 @container 都没问题。原生 CSS 嵌套不行：CSSO 的解析器比它出现得早，会把嵌套规则直接丢掉，所以这个工具会报解析错误而不是继续压缩。先把嵌套展开，或者交给 Lightning CSS 这类构建工具一并处理。

CSSO、cssnano、Lightning CSS 选哪个？

在常见样式表上三者压出来的体积差不多。cssnano 是一组 PostCSS 插件；Lightning CSS 用 Rust 写成，还能处理浏览器前缀和新语法降级；CSSO 的强项是结构合并。CSSO 的解析器没有跟上原生嵌套这类新语法，如果你的样式表用到了它们，这一点要考虑进去。

也常被称作

• css压缩
• 在线css压缩
• css压缩工具
• csso
• css代码压缩
• css优化