<NuxtImg>

<NuxtImg> 是原生 <img> 標籤的直接替換元件。

• 使用內建供應商來最佳化本地和遠端圖片
• 將 src 轉換為供應商最佳化的 URLs
• 根據 width 和 height 自動調整圖片大小
• 當提供 sizes 選項時，產生響應式尺寸
• 支援原生延遲載入以及其他 <img> 屬性

設定

為了使用 <NuxtImg>，您應該安裝並啟用 Nuxt Image 模組

npx nuxi@latest module add image

用法

<NuxtImg> 直接輸出原生 img 標籤（沒有任何包裝）。像您使用 <img> 標籤一樣使用它

<NuxtImg src="/nuxt-icon.png" />

將會產生

<img src="/nuxt-icon.png" />