Fügen Sie mit Nuxt 3 und Vite effizient globales CSS hinzu
<p>In meinem Projekt ist globales Sass enthalten, aber ich finde keine effiziente Möglichkeit, es zu meinem Projekt hinzuzufügen. </p>
<p>Es scheint zwei beliebte Möglichkeiten zu geben, CSS zu Ihrem Projekt hinzuzufügen. </p>
<pre class="brush:php;toolbar:false;">vite: {
Plugins: [svgLoader()],
CSS: {
Präprozessoroptionen: {
scss: {
zusätzlicheDaten: `
@import "~/assets/styles/main.scss";
`,
},
},
},</pre>
<p>Die Verwendung von Vite scheint zu funktionieren, aber es scheint sich auch in jede Komponente einzuschleusen, die ich verwende. Wenn ich also das Projekt erstelle, kann ich sehen, dass mein CSS mehrmals wiederholt wird und einige Dateien bis zu 300 Sekunden lang sind. Das Problem wurde auf der Vites-Seite gefunden: https://github.com/vitejs/vite/issues/4448</p>
<pre class="brush:php;toolbar:false;">css: ["@/assets/styles/main.scss"],</pre>
<p>Die oben genannten Optionen scheinen dies nicht für jede Komponente zu bewirken, aber Sass mit normalem Gültigkeitsbereich in der .vue-Datei erfasst beim Kompilieren mit dieser Methode keine Sass-Variablen und Mixins</p>
