MorJS cssMinimizerOptions - CSS 压缩选项
- 类型:
object - 默认值:
{}
css 压缩器自定义配置, 使用时请结合 cssMinimizer 所指定的压缩器来配置, 不同的压缩器对应的配置方式不同，参见：
-
cssnano: https://cssnano.co/ -
csso: https://github.com/css/csso -
cleanCss: https://github.com/clean-css/clean-css -
esbuild: https://esbuild.github.io/api/#minify -
parcelcss: https://parceljs.org/languages/css/#minification
cssMinimizerOptions 的配置会和 MorJS 内部的配置进行合并，且 cssMinimizerOptions 的优先级更高。
使用 esbuild 压缩 css 注意事项： [[EMOJI:%F0%9F%91%87]][[EMOJI:%F0%9F%8F%BB]]
-
esbuild 压缩器开启压缩时会默认将 0.5rpx 压缩为 .5rpx 的形式，而由于 .5rpx 的样式压缩写法在支付宝 IDE 中目前(2023.06.26) 不支持，需要使用完整的 0.5rpx 写法，后续支付宝 IDE 产研同学兼容后将自动修复，如遇到类似问题引发的样式显示错误，可添加以下配置以关闭 minifySyntax 进行兼容
{
...otherConfigs,
cssMinimizerOptions: {
minify: false,
minifyWhitespace: true,
minifyIdentifiers: true,
minifySyntax: false,
legalComments: 'inline',
},
}- 默认情况下 MorJS 配置的
esbuild 压缩 css 选项为 target: ['safari10']，该 target 下 rgba(0,0,0,0) 会被压缩为 16 进制的 HexRGBA，参见 ebuild 源代码，部分较老的浏览器下可能会不兼容，解决办法为指定 target: ['safari9'] 来解决
{
...otherConfigs,
cssMinimizerOptions: {
target: ['safari9']
},
}