Save a different file for each theme.

[phcoliveira]

Hello there!

I have been looking for something like this, but unfortunately it is not useful to me the way it works.

Suppose you have a base styling which can used with 3 themes. In order to have a final build with these themes, you would have to specify a theme, build, copy and paste app-1.css somewhere else, change the theme, build it again, copy and paste app-2.css somewhere else, change the theme, build it again, copy app-1.css and app-2.css and paste them along app-base.css and app-3.css.

Am I missing something?

I make no sense in specifying which theme to build. All of them should be built, resulting in app-base.css, app-1.css, app-2.css and app-3.css in a single folder: assets/css.

The resulting files could be meant to be used alone, as in <link src="app-1.css>, or in combination with the base styling, as in <link src="app-base.css><link src="app-1.css">.

Server or client logic should determine which theme to load, not compiling settings.

[zephraph]

Hey! Thanks for the feedback. I see where your coming from. The use-case for me building this was a bit different though. It's one tool in a larger pipeline to target different branded experiences. In my setup I have multiple webpack builds that run to build multiple different sites. They're just built off of the same application base.

With that said, I would like it to be more generally useful. There are some significant challenges to overcome though. We'd need to figure out how to emit multiple file outputs. Those outputs would have to be associated to the original component so that code splitting continued to work correctly. A mechanism for switching the theme would be needed. Technically none of these challenges are unsolvable, but it's a bit of work.

Want to help out?