如何在 Nuxt 中將所有 CSS 提取到一個檔案中？

Question

我目前正在為使用 ASP.NET 作為其專案的主應用程式/後端的客戶建立 UI 工具包。我正在建立的UI 套件是使用NuxtJS 創建的，我想將所有SCSS 文件與Bootstrap 一起編譯成單個已編譯的CSS 文件，根據我在Nuxt 文檔上收集的內容，他們建議將SCSS 文件編譯成單個每個組件的CSS 文件。

在我開始弄亂設定檔之前，有沒有辦法將它們編譯成單一文件，以便客戶端可以將其排入隊列？它不需要是最具性能的，這就是為什麼我們將其推送到單一文件中。

Answer 1

這是文件針對 Nuxt2 的部分，我引用

nuxt.config.js

export default {
  build: {
    extractCSS: true,
    optimization: {
      splitChunks: {
        cacheGroups: {
          styles: {
            name: 'styles',
            test: /\.(css|vue)$/,
            chunks: 'all',
            enforce: true
          }
        }
      }
    }
  }
}

---

這部分不是直接寫的，但仍然可用於Nuxt3 ，所以我想它應該以類似的方式工作。

Nuxt3 的儲存庫上只有一個討論，但您可以開始嘗試上面已經有片段，看看它是否滿足您的一些需求。