v3.17

<NuxtPicture>

Source
Nuxt 提供 <NuxtPicture> 组件来处理自动图片优化。

<NuxtPicture> 可以替代原生的 <picture> 标签。

¥<NuxtPicture> is a drop-in replacement for the native <picture> tag.

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

¥Usage of <NuxtPicture> is almost identical to <NuxtImg> but it also allows serving modern formats like webp when possible.

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

¥Learn more about the <picture> tag on MDN.

设置

¥Setup

为了使用 <NuxtPicture>，你应该安装并启用 Nuxt Image 模块：

¥In order to use <NuxtPicture> you should install and enable the Nuxt Image module:

Terminal
npx nuxi@latest module add image

:

Read more in https://image.nuxt.com/usage/nuxt-picture.

了解更多关于 <NuxtPicture> 组件的信息。

¥Read more about the <NuxtPicture> component.

::