層
Nuxt 提供了一個強大的系統,讓您可以擴展預設檔案、設定等更多內容。
Nuxt 的核心功能之一是 Layers 與擴充支援。您可以擴充預設的 Nuxt 應用程式,以重複使用元件、工具和設定。 Layers 的結構幾乎與標準 Nuxt 應用程式相同,這使得它們易於撰寫和維護。
使用案例
- 使用
nuxt.config
和app.config
在專案之間共享可重複使用的設定預設值 - 使用
components/
目錄建立元件庫 - 使用
composables/
和utils/
目錄建立工具和可組合函式庫 - 建立 Nuxt 模組預設值
- 在專案之間共享標準設定
- 建立 Nuxt 主題
- 透過實作模組化架構來增強程式碼組織,並在大規模專案中支援領域驅動設計 (DDD) 模式。
用法
預設情況下,您專案中 ~/layers
目錄內的任何 layers 都會自動註冊為您專案中的 layers
Layer 自動註冊功能在 Nuxt v3.12.0 中推出
此外,您可以透過將 extends 屬性新增到您的 nuxt.config
檔案中,從一個 layer 擴充。
nuxt.config.ts
export default defineNuxtConfig({
extends: [
'../base', // Extend from a local layer
'@my-themes/awesome', // Extend from an installed npm package
'github:my-themes/awesome#v1', // Extend from a git repository
]
})
如果您從私有的 GitHub 儲存庫擴充,您也可以傳遞身份驗證令牌
nuxt.config.ts
export default defineNuxtConfig({
extends: [
// per layer configuration
['github:my-themes/private-awesome', { auth: process.env.GITHUB_TOKEN }]
]
})
Nuxt 使用 unjs/c12 和 unjs/giget 來擴充遠端 layers。請查看文件以取得更多資訊和所有可用的選項。