資源

Nuxt 使用兩個目錄來處理資源，例如樣式表、字型或圖片。

• The public/ 目錄的內容會以現狀形式在伺服器根目錄提供。
• The assets/ 目錄依照慣例包含所有您希望建置工具（Vite 或 webpack）處理的資源。

Public 目錄

The public/ 目錄用作靜態資源的公共伺服器，這些靜態資源可在您應用程式的已定義 URL 公開存取。

您可以從應用程式碼或瀏覽器，透過根 URL / 來取得 public/ 目錄中的檔案。

範例

例如，引用 public/img/ 目錄中的圖片檔案，可透過靜態 URL /img/nuxt.png 存取

<template>
  <img src="/img/nuxt.png" alt="Discover Nuxt 3" />
</template>

Assets 目錄

Nuxt 使用 Vite (預設) 或 webpack 來建置和捆綁您的應用程式。這些建置工具的主要功能是處理 JavaScript 檔案，但它們可以透過 外掛程式（用於 Vite）或 載入器（用於 webpack）來擴展，以處理其他種類的資源，例如樣式表、字型或 SVG。此步驟主要為了效能或快取目的而轉換原始檔案（例如樣式表最小化或瀏覽器快取失效）。

依照慣例，Nuxt 使用 assets/ 目錄來儲存這些檔案，但此目錄沒有自動掃描功能，您可以為其使用任何其他名稱。

在您的應用程式碼中，您可以使用 ~/assets/ 路徑來引用位於 assets/ 目錄中的檔案。

範例

例如，引用一個圖片檔案，如果建置工具配置為處理此檔案副檔名，則將會被處理

<template>
  <img src="~/assets/img/nuxt.png" alt="Discover Nuxt 3" />
</template>