lightningcss
lightningcss copied to clipboard
media querries not working with lightningcssMinify in Safari 14
Hi, i use lightningcss in webpack like this:
module.exports = {
// ...
optimization: {
minimizer: [
'...',
new CSSMinimizerWebpackPlugin({
minify: CSSMinimizerWebpackPlugin.lightningCssMinify,
minimizerOptions: {
targets: lightningcss.browserslistToTargets(browserslist(browserslistQuery)),
},
}),
],
},
};
in my case i have source of styles:
@media (min-width: 0) {
.some-element {
width: 1000px;
}
}
Previously i used postcss with autoprefixer and output was:
@media (width>=0) {
.some-element {
width: 1000px;
}
}
This output working fine in Safari 14.1 on macos and iOS
Now with lightningcss output is:
@media (min-width: 0) {
.some-element {
width: 1000px;
}
}
This output not working in safari, only @media (min-width: 0px) or @media (width>=0) works fine
Is it possible to make output like in postcss? Looks like its more shorter and can helps to solve problems with safari compatibility
When i set safari >= 14 in browserslist query it not helps to solve issue
That's my fault?