基礎入門
CoreArchitecture
目錄結構
Nuxt 4 採用了全新的目錄架構,將應用程式邏輯集中於 app/,實現了更清晰的關注點分離 (Separation of Concerns)。
結構探索
點擊下方的目錄樹,查看每個資料夾的詳細職責與使用規範。
Project Explorer
app/
前端應用程式邏輯 (Vue App)。
#Frontend #Vue #Auto-import
詳細說明
這是開發者最常工作的地方。Nuxt 會自動掃描此目錄下的檔案,並處理路由、元件引入與狀態管理。
ID: app Select to view details
路徑別名 (Aliases)
為了避免使用冗長的相對路徑 (如 ../../components/Button.vue),Nuxt 提供了預設別名。
~
指向 app/ 目錄
用於引入 Vue 元件、Composables 或 Assets。
~/components/Header.vue
@
指向 專案根目錄
用於引入設定檔或根目錄下的資源。
@/nuxt.config.ts