使用 Nuxt 3 和 Vite 高效添加全域 CSS
<p>我的專案中包含全域 sass，但我找不到將其添加到專案中的有效方法。 </p>
<p>似乎有兩種流行的方法可以在專案中加入 css。 </p>
<pre class="brush:php;toolbar:false;">vite: {
plugins: [svgLoader()],
css: {
preprocessorOptions: {
scss: {
additionalData: `
@import "~/assets/styles/main.scss";
`,
},
},
},</pre>
<p>使用vite 似乎可以工作，但它似乎也將自身註入到我使用的每個元件中，因此當我生成專案時，我可以看到我的css 重複了多次，有些檔案多達300次。該問題在 vites 端找到 https://github.com/vitejs/vite/issues/4448</p>
<pre class="brush:php;toolbar:false;">css: ["@/assets/styles/main.scss"],</pre>
<p>上面的選項似乎並沒有對每個元件都執行此操作，但是 .vue 檔案中的普通作用域 sass 不會在使用此方法進行編譯時拾取 sass 變數和混合</p>
