Quantcast
Channel: How to extract multiple theme stylesheets with webpack? - Stack Overflow
Viewing all articles
Browse latest Browse all 3

How to extract multiple theme stylesheets with webpack?

$
0
0

I am trying to make a React app themeable. For now themes only consist of different sets of Sass variables which define different header colors, etc.

From my current understanding the ExtractTextPlugin seems to be my best bet as I don't want my styles to be inlined and rather have separate files per theme.

So I created two themes:

src/scss/themes/theme-a.scsssrc/scss/themes/theme-b.scss

The themes import the basic layout and common styles and override the relevant variables.

But the only way I managed to make webpack create separate css files for both themes was to create distinct entry points for each theme inmy webpack.prod.config:

entry: {  app: './src/js/init.js',  theme-a: './src/scss/themes/theme-a.scss',  theme-b: './src/scss/themes/theme-b.scss'},

But adding a new entry point for every new theme that gets added feels wrong and I figure there must be a better way?


Viewing all articles
Browse latest Browse all 3

Latest Images

Trending Articles





Latest Images