Skip to content

Could not minify CSS with container query #62

Description

@MattiasJa

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)

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions