入门
提供商
Nuxt Image 支持多个提供商以实现高性能。
提供商介绍
提供商是 Nuxt Image 与第三方图像转换服务之间的集成。每个提供商负责为该图像转换服务生成正确的 URL。
Nuxt Image 可以配置为与任何外部图像转换服务协同工作。查看侧边栏以获取预配置提供商列表。
如果您正在寻找尚未支持的特定提供商,您可以创建自己的提供商。
Nuxt Image 将自动优化<NuxtImg>
或<NuxtPicture>
源,并接受为指定目标的所有选项,除了特定于其他提供商的修饰符。
默认提供商
Nuxt Image 的默认优化器和提供商是ipx。无需任何配置即可使用这两个选项。
本地图像
图像应存储在项目public/
目录中。
例如,使用<NuxtImg src="/nuxt-icon.png" />
时,它应放置在public/
文件夹下的路径public/nuxt-icon.png
中。
有关更多信息,您可以详细了解public 目录。
存储在
assets/
目录中的图像不会使用 Nuxt Image 进行处理,因为这些图像由您的打包器(如 Vite 或 webpack)管理。远程图像
使用默认提供商,您还可以优化外部 URL。为此,您需要将它们添加到domains
选项中。
您还可以通过将NUXT_IMAGE_DOMAINS
环境变量设置为用逗号分隔的域名列表来添加远程图像的域名。
NUXT_IMAGE_DOMAINS="example.com,yourdomain.com"
环境检测
您可以使用NUXT_IMAGE_PROVIDER
环境变量设置默认提供商。
自动检测的提供商
自定义提供商
可以定义您自己的提供商,了解有关如何创建自定义提供商 的更多信息。