通过 100+ 个技巧学习 Nuxt!

<NuxtPicture>

Nuxt 提供了一个 <NuxtPicture> 组件来处理自动图像优化。

<NuxtPicture> 是原生 <picture> 标签的直接替代品。

<NuxtPicture> 的用法几乎与 <NuxtImg> 相同,但它也允许在可能的情况下提供像 webp 这样的现代格式。

在 MDN 上了解更多关于 <picture> 标签的信息

安装设置

为了使用 <NuxtPicture>,您应该安装并启用 Nuxt Image 模块

终端
npx nuxi@latest module add image
阅读更多关于 <NuxtPicture> 组件的信息。