透過超過 100 個訣竅學習 Nuxt!
發佈·  

Nuxt 3.14

Nuxt 3.14 已發佈 - 包含新的 rspack 建構器、共享資料夾和效能增強!

在幕後,為了 Nuxt v4 的發佈,做了很多準備工作(尤其是在 unjs 方面,為 Nitro v3 做準備!)

⚡️ 由 jiti 提供支援的更快啟動

現在,載入 nuxt 設定檔,以及模組和其他建構時程式碼,由 jiti v2 提供支援。您可以在 jiti v2 發佈說明中看到更多關於此版本的資訊,但其中最重要的一點是原生 node esm 導入(在可能的情況下),這意味著啟動速度應該會更快。✨

📂 用於與客戶端/伺服器共享程式碼和類型的共享資料夾

您永遠不應該在您的 nitro 程式碼中導入 Vue 應用程式程式碼(反之亦然)。但是,當涉及到共享不依賴於 nitro/vue 環境的類型或工具時,這就造成了一個摩擦點。

為此,我們有一個新的 shared/ 資料夾 (#28682)。您不能將 Vue 或 nitro 程式碼導入到此資料夾中的檔案,但是它會產生自動導入(如果您使用 compatibilityVersion: 4),您可以在應用程式的其他部分使用這些自動導入。

如果需要,您可以使用指向此資料夾的新 #shared 別名。

共享資料夾與您的 server/ 資料夾位於同一層級。(如果您使用 compatibilityVersion: 4,這表示它不在您的 app/ 資料夾內。)

🦀 rspack 建構器

我們很高興宣布為 rspack 提供新的第一級 Nuxt 建構器。它仍然是實驗性的,但我們已重構內部 Nuxt 虛擬檔案系統以使用 unplugin 來實現這一點。

如果您喜歡它,請告訴我們 - 並隨時提出您遇到的任何問題。

👉 要試用它,您可以使用這個入門套件 - 或直接安裝 @nuxt/rspack-builder 並在您的 nuxt 設定檔中設定 builder: 'rspack'

✨ 新的 composables

我們有新的 useResponseHeaderuseRuntimeHook composables (#27131#29741)。

🔧 新的模組工具

我們現在有一個新的 addServerTemplate 工具 (#29320),用於新增虛擬檔案以在 nitro 執行階段路由內存取。

🚧 v4 變更

我們合併了一些只有在 compatibilityVersion: 4 的情況下才會生效的變更,但您可以提早選擇啟用

  1. 先前,如果您有一個像 ~/components/App/Header.vue 這樣的元件,這會在您的開發人員工具中顯示為 <Header>。從 v4 開始,我們確保它為 <AppHeader>,但它是選擇性的,以避免中斷您可能已實作的任何手動 <KeepAlive>。( #28745 )。
  2. Nuxt 會在呼叫 pages:extend 之前從您的檔案掃描頁面中繼資料。但是,這導致了一些令人困惑的行為,因為在此時新增的頁面最終不會被尊重其頁面中繼資料。因此,我們現在不會在呼叫 pages:extend 之前掃描中繼資料。相反,我們有一個新的 pages:resolved hook,它會在 pages:extend 之後被呼叫,在所有頁面都使用其中繼資料擴增之後。我建議將 experimental.scanPageMeta 設定為 after-resolve 來選擇加入此功能,因為它可以解決許多錯誤。

🗺️ v3.15 的路線圖

它們沒有及時趕上 v3.14,但在下一個次要版本中,您可以期待(其他功能)

  • 從模組自動導入的指令 (#29203)
  • 「隔離」頁面渲染 (#29366)
  • 延遲 hydration (#26468)

✅ 升級

像往常一樣,我們建議的升級方式是執行

npx nuxi@latest upgrade --force

這也會刷新您的鎖定檔,並確保您從 Nuxt 所依賴的其他相依性(尤其是在 unjs 生態系統中)中提取更新。

完整發行說明

閱讀 Nuxt v3.14.0 的完整發行說明。

非常感謝參與此版本的所有人。我們在下一個版本中還有令人興奮的事情!❤️

如果您有任何回饋或問題,請隨時告訴我們!🙏