vue3-image-compressor 1.0.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +174 -0
- package/dist/assets/imageWorker-DyeUTFOy.js +67 -0
- package/dist/components/ImageCompressor.vue.d.ts +38 -0
- package/dist/composables/useCompression.d.ts +170 -0
- package/dist/composables/useEncoderRegistry.d.ts +17 -0
- package/dist/composables/useWorker.d.ts +11 -0
- package/dist/constants/encoders.d.ts +5 -0
- package/dist/constants/resizeMethods.d.ts +39 -0
- package/dist/index.d.ts +15 -0
- package/dist/style.css +1 -0
- package/dist/types/compression.d.ts +35 -0
- package/dist/types/encoder.d.ts +100 -0
- package/dist/types/processor.d.ts +30 -0
- package/dist/types/worker.d.ts +21 -0
- package/dist/utils/file.d.ts +23 -0
- package/dist/utils/image.d.ts +31 -0
- package/dist/vue-image-compressor.js +660 -0
- package/dist/vue-image-compressor.umd.cjs +1 -0
- package/dist/workers/imageWorker.d.ts +4 -0
- package/dist/workers/utils/emscripten.d.ts +6 -0
- package/package.json +49 -0
- package/src/components/ImageCompressor.vue +304 -0
- package/src/composables/useCompression.ts +314 -0
- package/src/composables/useEncoderRegistry.ts +70 -0
- package/src/composables/useWorker.ts +132 -0
- package/src/constants/encoders.ts +137 -0
- package/src/constants/resizeMethods.ts +23 -0
- package/src/index.ts +63 -0
- package/src/types/compression.ts +38 -0
- package/src/types/encoder.ts +144 -0
- package/src/types/processor.ts +36 -0
- package/src/types/worker.ts +29 -0
- package/src/utils/file.ts +48 -0
- package/src/utils/image.ts +90 -0
- package/src/workers/imageWorker.ts +107 -0
- package/src/workers/utils/emscripten.ts +16 -0
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* 处理器类型定义
|
|
3
|
+
* 对标 Squoosh: src/features/processors/resize/shared/meta.ts
|
|
4
|
+
*/
|
|
5
|
+
export interface ResizeOptions {
|
|
6
|
+
enabled: boolean;
|
|
7
|
+
width: number;
|
|
8
|
+
height: number;
|
|
9
|
+
method: 'lanczos3' | 'catrom' | 'mitchell' | 'triangle' | 'vector';
|
|
10
|
+
fitMethod: 'stretch' | 'contain';
|
|
11
|
+
premultiply: boolean;
|
|
12
|
+
linearRGB: boolean;
|
|
13
|
+
}
|
|
14
|
+
export interface QuantizeOptions {
|
|
15
|
+
enabled: boolean;
|
|
16
|
+
numColors: number;
|
|
17
|
+
dither: number;
|
|
18
|
+
}
|
|
19
|
+
export interface RotateOptions {
|
|
20
|
+
rotate: number;
|
|
21
|
+
}
|
|
22
|
+
export interface ProcessorState {
|
|
23
|
+
resize: ResizeOptions;
|
|
24
|
+
quantize: QuantizeOptions;
|
|
25
|
+
}
|
|
26
|
+
export interface PreprocessorState {
|
|
27
|
+
rotate: RotateOptions;
|
|
28
|
+
}
|
|
29
|
+
export type ResizeMethod = 'lanczos3' | 'catrom' | 'mitchell' | 'triangle' | 'vector';
|
|
30
|
+
export type FitMethod = 'stretch' | 'contain';
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Worker API 类型定义
|
|
3
|
+
* 对标 Squoosh: src/client/lazy-app/worker-bridge/meta.ts
|
|
4
|
+
*/
|
|
5
|
+
export interface WorkerApi {
|
|
6
|
+
avifDecode(blob: Blob): Promise<ImageData>;
|
|
7
|
+
jxlDecode(blob: Blob): Promise<ImageData>;
|
|
8
|
+
qoiDecode(blob: Blob): Promise<ImageData>;
|
|
9
|
+
webpDecode(blob: Blob): Promise<ImageData>;
|
|
10
|
+
wp2Decode(blob: Blob): Promise<ImageData>;
|
|
11
|
+
avifEncode(data: ImageData, options: any): Promise<Uint8Array>;
|
|
12
|
+
jxlEncode(data: ImageData, options: any): Promise<Uint8Array>;
|
|
13
|
+
mozjpegEncode(data: ImageData, options: any): Promise<Uint8Array>;
|
|
14
|
+
oxipngEncode(data: ImageData, options: any): Promise<Uint8Array>;
|
|
15
|
+
qoiEncode(data: ImageData, options: any): Promise<Uint8Array>;
|
|
16
|
+
webpEncode(data: ImageData, options: any): Promise<Uint8Array>;
|
|
17
|
+
wp2Encode(data: ImageData, options: any): Promise<Uint8Array>;
|
|
18
|
+
rotate(data: ImageData, options: any): Promise<ImageData>;
|
|
19
|
+
quantize(data: ImageData, options: any): Promise<ImageData>;
|
|
20
|
+
resize(data: ImageData, options: any): Promise<ImageData>;
|
|
21
|
+
}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* 文件工具函数
|
|
3
|
+
*/
|
|
4
|
+
/**
|
|
5
|
+
* 格式化文件大小
|
|
6
|
+
*/
|
|
7
|
+
export declare function formatBytes(bytes: number, decimals?: number): string;
|
|
8
|
+
/**
|
|
9
|
+
* 计算节省百分比
|
|
10
|
+
*/
|
|
11
|
+
export declare function calculateSavings(originalSize: number, compressedSize: number): number;
|
|
12
|
+
/**
|
|
13
|
+
* 生成压缩后的文件名
|
|
14
|
+
*/
|
|
15
|
+
export declare function generateCompressedFilename(originalName: string, extension: string): string;
|
|
16
|
+
/**
|
|
17
|
+
* 创建 Blob URL
|
|
18
|
+
*/
|
|
19
|
+
export declare function createBlobUrl(blob: Blob): string;
|
|
20
|
+
/**
|
|
21
|
+
* 释放 Blob URL
|
|
22
|
+
*/
|
|
23
|
+
export declare function revokeBlobUrl(url: string): void;
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* 图像工具函数
|
|
3
|
+
*/
|
|
4
|
+
/**
|
|
5
|
+
* 从 Blob 解码图片为 ImageData
|
|
6
|
+
* 使用浏览器内置的 createImageBitmap
|
|
7
|
+
*/
|
|
8
|
+
export declare function blobToImageData(blob: Blob): Promise<ImageData>;
|
|
9
|
+
/**
|
|
10
|
+
* ImageData 转 Blob(用于浏览器编码器如 JPEG/PNG)
|
|
11
|
+
*/
|
|
12
|
+
export declare function imageDataToBlob(imageData: ImageData, mimeType: string, quality?: number): Promise<Blob>;
|
|
13
|
+
/**
|
|
14
|
+
* 从文件获取图片尺寸
|
|
15
|
+
*/
|
|
16
|
+
export declare function getImageDimensions(file: File): Promise<{
|
|
17
|
+
width: number;
|
|
18
|
+
height: number;
|
|
19
|
+
}>;
|
|
20
|
+
/**
|
|
21
|
+
* 检测图片 MIME 类型
|
|
22
|
+
*/
|
|
23
|
+
export declare function sniffMimeType(blob: Blob): Promise<string>;
|
|
24
|
+
/**
|
|
25
|
+
* 检查浏览器是否支持解码某图片格式
|
|
26
|
+
*/
|
|
27
|
+
export declare function canDecodeImageType(mimeType: string): Promise<boolean>;
|
|
28
|
+
/**
|
|
29
|
+
* ArrayBuffer 转 File
|
|
30
|
+
*/
|
|
31
|
+
export declare function arrayBufferToFile(buffer: ArrayBuffer, filename: string, mimeType: string): File;
|