CSS variables cause build failure

[colah]

Setting a CSS variable in a <style> section of a svelte template triggers a build error:

<style>
.foo {  --test: 10; }
</style>

Module build failed: Error: TypeError: Cannot read property '0' of undefined

• repl link

I don't have any experience using CSS variables, but it seems like this should work.

[Conduitry]

Here's how css-tree parses that. The value of the custom property declaration has type: 'Raw', and has no children array, and so an error is thrown here. We could try skipping minifying the value in that case - or maybe we could just .trim() it. I've never used CSS custom properties either, so I haven't thought about what sorts of transforming is safe to do on the value.

[colah]

Skipping or .trim() both seem like reasonable places to start. :)

(My actual use case involves setting a variable to length values, and I think the other common use case is a color value. Seems like there probably isn't a huge amount to win in trying to minify it.)

[Rich-Harris]

Fixed in 1.34 — thanks for the report, sorry for the delay!