babel-plugin-template-html-minifier icon indicating copy to clipboard operation
babel-plugin-template-html-minifier copied to clipboard

Could not minify CSS with container query

Open MattiasJa opened this issue 2 years ago • 2 comments

Hi, fail trying to minify css with some container queries.

Reproduce by adding this minimal css :

@container small (width < 768px) {
h2 {
width: 100%;
}
}

while this empty query pass :

@container small (width < 768px) {
}

Stack:

 [babel-plugin-template-html-minifier] Could not minify CSS: Unexpected '}' at 6:8., Invalid character(s) '}' at 6:8. Ignoring., Invalid property name 'h2 {
            width' at 2:10. Ignoring.
  4 |     return [
  5 |         style,
> 6 |         css`@container small (width < 768px) {
    |         ^
  7 |           h2 {
  8 |             width: 100%;
  9 |           }
    at File.buildCodeFrameError (...path...node_modules\@babel\core\lib\transformation\file\file.js:205:12)
    at NodePath.buildCodeFrameError (...path...node_modules\@babel\traverse\lib\path\index.js:101:21)
    at minify (...path...node_modules\babel-plugin-template-html-minifier\lib\index.js:85:15)
    at handleSimple (C:\Users\MattiasJ\git\sccc\node_modules\babel-plugin-template-html-minifier\lib\index.js:114:3)
    at PluginPass.TaggedTemplateExpression (...path...node_modules\babel-plugin-template-html-minifier\lib\index.js:211:6)
    at newFn (...path...node_modules\@babel\traverse\lib\visitors.js:159:14)
    at NodePath._call (...path...node_modules\@babel\traverse\lib\path\context.js:46:20)

MattiasJa avatar Aug 30 '23 13:08 MattiasJa

I'm running into this same issue and will comment if I find a solution.

freddiemixell avatar Jun 26 '24 19:06 freddiemixell

Same for me. Any luck @freddiemixell?

bobbyearl avatar Jul 23 '24 21:07 bobbyearl