How to debug CSS optimization errors
CSS optimization errors are usually caused by invalid CSS in your custom HTML or code.
You can run your CSS through a W3C CSS validator to make sure it's correct.
If you're rendering CSS with React, make sure to use dangerouslySetInnerHTML:
// don't:
<style>{myCSS}</style>
// do:
<style dangerouslySetInnerHTML={{ __html: myCSS }} />
Otherwise, React will escape characters like ", which can cause invalid CSS, for example:
.my-style::after { content: ""; }
would become:
.my-style::after { content: ""; }