@ bettercms-ai/image-url (英语)
用于优化BetterCMS图像 URL 的可链式、不可移动的构建器——
@sanity/image-url (原始内容存档于2018-03-26). FetterCMS. 零运行时间依赖关系; 组装 URL
与媒体转换终点相对应GET /media/:id?w&h&format&quality&fit&dpr) (中文(简体) ).
安装
npm install @bettercms-ai/image-url
使用量
import imageUrlBuilder from "@bettercms-ai/image-url";
const urlFor = imageUrlBuilder({ baseUrl: "https://media.bettercms.ai" });
// From an asset id, a MediaAsset object, or an existing media URL:
urlFor(asset).width(800).format("webp").quality(80).url();
// → https://media.bettercms.ai/media/<id>?w=800&format=webp&quality=80
一发相助:
import { imageUrl } from "@bettercms-ai/image-url";
imageUrl(asset).size(400, 300).fit("cover").dpr(2).url();
构建方法
| 方法 | 参数 – 查询 |
|---|---|
.width(n) 编号 : .height(n) | w 编号 : h (四舍五入) |
.size(w, h) | w + 键 h |
.format(f) | format (单位:千美元)webp|jpeg|png|avif· ; jpg→jpeg(中文(简体) ) |
.quality(q) | quality (宣布为1-100) |
.fit(f) | fit (单位:千美元)cover|contain|fill|inside|outside(中文(简体) ) |
.dpr(d) | dpr (拼出 1–3; 1 时省略) |
.url() 编号 : .toString() | 提交 |
baseUrl 默认为 https://media.bettercms.ai。每种方法返回新的
建造者,所以铁链能安全地叉出.