t-comm
Version:
专业、稳定、纯粹的工具库
105 lines (104 loc) • 3.45 kB
TypeScript
/**
/**
* 处理图片尺寸单位，将 px/rem 转换为纯数字
* @docgen
* @function handleImgUnit
*
* @param {number|string} size - 输入的尺寸值
* @return {number} 返回处理后的数值（px）
*
* @description
* 该函数用于处理图片尺寸，去除单位（px/rem）并转换为数字类型。
* - 纯数字：直接返回
* - px 单位：去除 'px' 后返回数字
* - rem 单位：乘以根元素的 fontSize 转换为 px 值
*
* @example
*
* handleImgUnit(3); // 3
* handleImgUnit('10'); // 10
* handleImgUnit('30px'); // 30
*
* // 假设 document.documentElement.style.fontSize = '50px'
* handleImgUnit('5rem'); // 250
*
* // 假设 document.documentElement.style.fontSize = '10px'
* handleImgUnit('5rem'); // 50
*/
export declare const handleImgUnit: (size: number | string) => string | number | undefined;
/**
* 将图片地址由 http 替换为 https 协议
* @param url 图片地址
* @returns 新的地址
*/
export declare const getHttpsUrl: (inUrl: string) => string;
/**
* 获取 cdn 链接
* @param {string} url 图片地址
* @returns 新的地址
*/
export declare function getCdnUrl(inUrl?: string): string;
/**
* 处理并压缩图片 URL
* @docgen
* @function getCompressImgUrl
*
* @param {string|object} inUrl - 图片原始 URL，或包含 url/width/height 的对象
* @param {number} [inImageWidth=0] - 图片裁剪后的宽度（可选，默认为 0，表示不裁剪）
* @param {number} [inImageHeight=0] - 图片裁剪后的高度（可选，默认为 0，表示不裁剪）
* @return {string} 返回处理后的图片 URL
*
* @description
* 该函数用于处理腾讯云 COS 图片，实现按需加载和压缩。
* - 自动将 http 转为 https
* - 对腾讯云图片添加压缩参数
* - 自动调整图片尺寸为 2 倍（避免图片模糊）
* - 宽高按 10 取整（避免图片闪烁）
*
* @example
*
* // 基础用法
* const url = 'https://image-xxx.file.myqcloud.com/test.jpg';
* const compressed = getCompressImgUrl(url, 100, 100);
*
* // 使用对象参数
* const compressed2 = getCompressImgUrl({
* url: 'https://image-xxx.file.myqcloud.com/test.jpg',
* width: 100,
* height: 100
* });
*/
export declare function getCompressImgUrl(inUrl: string | {
width?: number;
height?: number;
url?: string;
replace?: Function;
}, inImageWidth?: number, inImageHeight?: number): string;
/**
* 处理图片 URL（换 CDN 域名 + 裁剪压缩）
* @docgen
* @function tinyImage
*
* @param {string} inUrl - 图片原始 URL
* @param {number} [width=0] - 图片裁剪后的宽度（可选，默认为 0，表示不裁剪）
* @param {number} [height=0] - 图片裁剪后的高度（可选，默认为 0，表示不裁剪）
* @return {string} 返回处理后的图片 URL
*
* @description
* 该函数是图片处理的综合方法，依次执行：
* 1. 将 http 转为 https
* 2. 替换为 CDN 域名
* 3. 添加压缩和裁剪参数
*
* @example
*
* const url = 'http://igame-10037599.cos.ap-shanghai.myqcloud.com/test.jpg';
* const optimized = tinyImage(url, 200, 200);
* // 结果：https 域名 + CDN + 压缩参数
*/
export declare const tinyImage: (inUrl: string, imageWidth?: number, imageHeight?: number) => string;
/**
* 判断当前浏览器是否支持 webp
* @returns {Promise<boolean> }是否支持
*/
export declare const isSupportedWebp: () => () => any;