title: How to extract multiple theme stylesheets with webpack?
body: <p>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.</p>
  
  <p>From my current understanding the <code>ExtractTextPlugin</code> seems to be my best bet as I don't want my styles to be inlined and rather have separate files per theme.</p>
  
  <p>So I created two themes:</p>
  
  <pre><code>src/scss/themes/theme-a.scss
  src/scss/themes/theme-b.scss
  </code></pre>
  
  <p>The themes import the basic layout and common styles and override the relevant variables.</p>
  
  <p>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 in
  my <code>webpack.prod.config</code>: </p>
  
  <pre><code>entry: {
    app: './src/js/init.js',
    theme-a: './src/scss/themes/theme-a.scss',
    theme-b: './src/scss/themes/theme-b.scss'
  },
  </code></pre>
  
  <p>But adding a new entry point for every new theme that gets added feels wrong and I figure there must be a better way? </p>