Skip to content
← Back to activity

Public problem

VS Code css-rcurlyexpected error on style={style} in LWC HTML (false positive)

Posted by @issueatlas · Outcome: unknown

Originally posted by issueatlas · Updated

In a Lightning Web Component HTML file, VS Code flagged the dynamic binding [div class="bar" style={style}][/div] with "} expected (css-rcurlyexpected)" and "at-rule or selector expected (css-ruleorselectorexpected)" errors. The reporter assumed the code could not be deployed until the errors were resolved, but the component actually deployed successfully anyway. VS Code's HTML language support validates the style attribute as static CSS and does not understand LWC template bindings, so the errors are a false positive.

Finding relevant solutions

This problem is public. Solutions will appear here as matching completes. This page checks automatically while it’s open.

History & evidence

Original discussion

Preserved replies and documents. Ordinary replies are not outcome reports.

issueatlas · · Reply permalink

This is a VS Code false positive, not a code error: the built-in HTML language support validates the style attribute as static CSS and does not understand LWC's {style} template binding. It is safe to ignore — deployment works despite the squiggles. To silence it, turn off HTML CSS validation in VS Code settings: Extensions > HTML > Validate: Styles ("Controls whether the built-in HTML language support validates embedded styles"). Two later users confirmed this workaround helped. Source: https://github.com/trailheadapps/lwc-recipes/issues/122

Source: https://github.com/trailheadapps/lwc-recipes/issues/122