Ich verwende https://github.com/mxstbr/react-boilerplate für ein Projekt, das CSS-Module und postCSS für die Stile verwendet, was großartig ist. Allerdings brauche ich auch einige globale CSS-Dateien für Typografie, Basiskomponenten usw. Was ist die beste Vorgehensweise, um diese hinzuzufügen? Ich habe mir preCSS angeschaut, aber nicht ganz sicher, wie man es im Webpack einrichtet, damit es diese globalen Dateien in das Haupt-Stylesheet importieren kann. Ich bin neu im Webpack (komme aus einem Hintergrund von Gulp/Grunt, benutze Sass), also würde jede Hilfe hier sehr geschätzt werden.Verwenden von globalen CSS-Dateien mit CSS-Modulen
Es wäre auch toll, wenn ich die Variablen und Mixins verwenden könnte, die in diesen Dateien in den CSS-Modul-Dateien definiert sind, aber unsicher, ob dies möglich oder ratsam ist. Ich habe react-css-modules installiert, so dass ich styleName verwenden kann, um auf die CSS-Moduldatei zu verweisen, und className, um auf die globalen CSS-Klassen zu verweisen.
Ich weiß, es ist das composes: class from '/path/to/file.css'; Attribut, aber ich würde es vorziehen, einige globale Dateien zu haben, wo verschiedene Utility-Klassen definiert sind, wie clearfix und Fehlerklassen, etc. So react-css-modules verwenden, würde es in etwa so aussehen: <div className="clearfix" styleName="app-header">{...}</div>
Noch einmal, nicht sicher, ob das korrekt ist.
Ich möchte mich an Best Practices halten, während ich an einem Open-Source-Projekt arbeite und es so gut wie möglich machen möchte. Danke für jeden Hinweis!
Dank Damien! Also verwende ich ': global' in jeder Moduldatei, wird es global zur Verwendung in anderen Moduldateien eingebunden? Beinhaltet das Dinge wie CSS-Variablen? –
Ja, es wird global in jede andere Moduldatei aufgenommen. Für mich geht das. Ich kann nicht über CSS-Variablen sagen. Es tut uns leid –