提供商
Uploadcare
一次性增强您的应用程序的文件上传、处理和交付功能。
Uploadcare 和 Nuxt Image 模块之间的集成。
使用
要使用来自 uploadcare 的图像,请将提供商指定为 uploadcare
,并将图像 src 设置为仪表板中提供的 UUID。
page.vue
<NuxtImg
provider="uploadcare"
src="c160afba-8b42-45a9-a46a-d393248b0072"
alt="My image from uploadcare"
/>
修饰符
要查看所有可能的修饰符及其选项,请查看 图像转换文档 或 URL API 参考。
为以下修饰符提供类型
src/types/module.ts
// Image Compression
format: 'jpeg' | 'png' | 'webp' | 'auto'
quality: 'smart' | 'smart_retina' | 'normal' | 'better' | 'best' | 'lighter' | 'lightest'
progressive: 'yes' | 'no'
strip_meta: 'all' | 'none' | 'sensitive'
// Image Geometry
preview: `${number}x${number}` // Height x Width
resize: `${number}x${number}` | `${number}x`| `x${number}`
smart_resize: `${number}x${number}`
crop: string | string[]
scale_crop: string | string[]
border_radius: string | string[]
setfill: string // 3, 6 or 8 digit hex color
zoom_objects: string // 1 to 100
请随时打开 PR 来改进对更多操作的支持。
配置
默认情况下,所有文件 URL 使用
ucarecdn.com
域。通过设置自定义 CDN CNAME,文件 URL 可以使用cdn.mycompany.com
代替。
请参阅 Uploadcare 文档,了解如何在您的项目中启用自定义域。要将自定义 CDN 名称告诉 Nuxt Image,请使用以下配置
nuxt.config.ts
export default defineNuxtConfig({
image: {
uploadcare: {
cdnURL: 'cdn.mycompany.com',
}
}
})