提供商

Gumlet

Nuxt Image 与 Gumlet 完美集成。

Gumlet 与图片模块之间的集成。

要使用此提供商,您只需在 Gumlet 中指定服务的根 URL。

nuxt.config.ts
export default defineNuxtConfig({
  image: {
    gumlet: {
      baseURL: 'https://demo.gumlet.io'
    }
  }
})

gumlet mode

Gumlet 支持 Nuxt 图片和 Nuxt 图片的所有 标准 fit 属性值

gumlet 修饰符

除了 标准修饰符 之外,您还可以将所有 Gumlet 特定的渲染 API 参数传递给 modifiers 属性。

有关这些修饰符及其用途的完整列表,请查看 Gumlet 的图像渲染 API 文档

gumlet 最佳实践

使用 Gumlet 时的一些常见最佳实践是包含我们的 format=auto 参数,它将自动为图片应用最佳格式并压缩图片。将此与一些最先进的智能裁剪和调整大小相结合,您将拥有一张很棒的图片!

<NuxtImg
  provider="gumlet"
  src="/sea.jpeg"
  width="300"
  height="500"
  fit="cover"
  :modifiers="{ format: 'auto', compress: 'true' }"
/>

这将返回一张 300 x 500 的图片,它已被压缩,将为浏览器显示下一代格式,并且已通过智能方式裁剪到 戴帽子的女人 的脸上。