Wie extrahiere ich mehrere Theme Stylesheets mit dem Webpack?

Ich versuche, eine React-App zum Thema zu machen. Im Moment bestehen Themes nur aus verschiedenen Sass-Variablensätzen, die unterschiedliche Header-Farben usw. definieren.

ach meinem derzeitigen Verständnis ist dasExtractTextPlugin scheint meine beste Wahl zu sein, da ich nicht möchte, dass meine Stile eingebettet sind und stattdessen separate Dateien pro Thema haben.

So habe ich zwei Themes erstellt:

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

Die Designs importieren das Basislayout und die allgemeinen Stile und überschreiben die relevanten Variablen.

Aber die einzige Möglichkeit, Webpack dazu zu bringen, separate CSS-Dateien für beide Themen zu erstellen, bestand darin, unterschiedliche Einstiegspunkte für jedes Thema in meinem @ zu erstellewebpack.prod.config:

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

Aber das Hinzufügen eines neuen Einstiegspunkts für jedes neue Thema, das hinzugefügt wird, fühlt sich falsch an und ich denke, es muss einen besseren Weg geben?

Antworten auf die Frage(4)

Ihre Antwort auf die Frage