Using less for svelte component styles

[dschulten]

The webpack buildchain for styles focuses on producing a common css style in the html head section. While it is possible with ExtractTextPlugin to extract the styles into separate css files, but still they go to link tags in the htmml head.

Svelte has a different approach, it attempts to make the css local to components. What seems to be needed is a way to process .less files with webpack (less-loader?) in such a way that it really produces css files which then would have to be included or embedded into the svelte component markup, so that svelte can make them local.

Not sure if this is something that should be solved by svelte-loader, but for the idea to use less in svelte-components, this is hopefully a more appropriate audience than less-loader.

Could this be solved by svelte-loader, i.e. could it pick up less files and add them to components?

[dschulten]

For a use case why you might want less rather than css, even though "not much need for cascading in a component", think of a responsive menu component, sth like https://gist.github.com/lavoiesl/7664315

[dschulten]

closed after understanding better how svelte scoped styles work. I've opened sveltejs/v2.svelte.dev#27 instead