Vigia

将 skia-canvas 从 3.x 升级到 4.x

根据 TypeScript 类型自动比较 skia-canvas 3.0.8 与 4.0.0 的公开 API。签名变化表示可能存在不兼容变更，并非确定结论。

概要

已删除的导入路径0
已删除的导出0
已修改的签名13
已删除的类或接口成员2
已修改的类或接口成员44
新增弃用1
要求变化（engines、peer 依赖）0
新增导出30

已删除的导出

未发现。

已修改的签名

export之前之后
skia-canvas · Matrixstring | DOMMatrix | { a: number; b: number; c: number; d: number; e: number; f: number; } | FixedLenArray<number, 6> | FixedLenArray<number, 16>DOMMatrix | TransformString | { a: number; b: number; c: number; d: number; e: number; f: number; } | FixedLenArray<number, 6> | FixedLenArray<number, 16>
skia-canvas · loadImage(src: string | URL, options?: RequestInit | undefined): Promise<Image> | (src: any): Promise<Image>(src: string | URL, options?: any): Promise<Image> | (src: any, options?: any): Promise<Image>
skia-canvas · ColorSpace"srgb""srgb" | "display-p3"
skia-canvas · CursorStyle"copy" | "move" | "none" | "default" | "crosshair" | "hand" | "arrow" | "text" | "wait" | "help" | "progress" | "not-allowed" | "context-menu" | "cell" | "vertical-text" | "alias" | "no-drop" | "grab" | "grabbing" | "all-scroll" | "zoom-in" | "zoom-out" | "e-resize" | "n-resize" | "ne-resize" | "nw-resize" | "s-resize" | "se-resize" | "sw-resize" | "w-resize" | "ew-resize" | "ns-resize" | "nesw-resize" | "nwse-resize" | "col-resize" | "row-resize""none" | "copy" | "move" | "default" | "crosshair" | "pointer" | "text" | "wait" | "help" | "progress" | "not-allowed" | "context-menu" | "cell" | "vertical-text" | "alias" | "no-drop" | "grab" | "grabbing" | "all-scroll" | "zoom-in" | "zoom-out" | "e-resize" | "n-resize" | "ne-resize" | "nw-resize" | "s-resize" | "se-resize" | "sw-resize" | "w-resize" | "ew-resize" | "ns-resize" | "nesw-resize" | "nwse-resize" | "col-resize" | "row-resize"
skia-canvas · ExportFormat"png" | "jpg" | "jpeg" | "webp" | "raw" | "pdf" | "svg""png" | "jpg" | "jpeg" | "webp" | "raw" | "pdf" | "svg" | "image/png" | "image/jpeg" | "image/webp" | "application/pdf" | "image/svg+xml" | "application/octet-stream"
skia-canvas · WindowEvents{ mousedown: MouseEventProps; mouseup: MouseEventProps; mousemove: MouseEventProps; keydown: KeyboardEventProps; keyup: KeyboardEventProps; input: { data: string; inputType: TextInputType; }; wheel: { deltaX: number; deltaY: number; }; fullscreen: { enabled: boolean; }; move: { left: number; top: number; }; resize: { height: number; width: number; }; frame: { frame: number; }; draw: { frame: number; }; blur: {}; focus: {}; setup: {}; close: {}; }{ mousedown: MouseEventProps; mouseup: MouseEventProps; mousemove: MouseEventProps; mouseenter: MouseEventProps; mouseleave: MouseEventProps; pointerdown: CoalescedPointerEventProps; pointerup: CoalescedPointerEventProps; pointermove: CoalescedPointerEventProps; pointerover: PointerEventProps; pointerenter: PointerEventProps; pointerout: PointerEventProps; pointerleave: PointerEventProps; pointercancel: PointerEventProps; keydown: KeyboardEventProps; keyup: KeyboardEventProps; input: { data: string; inputType: TextInputType; }; compositionstart: CompositionEventProps; compositionupdate: Compos…
skia-canvas · WindowOptions{ title?: string | undefined; left?: number | undefined; top?: number | undefined; width?: number | undefined; height?: number | undefined; fit?: FitStyle | undefined; page?: number | undefined; background?: string | undefined; fullscreen?: boolean | undefined; borderless?: boolean | undefined; resizable?: boolean | undefined; visible?: boolean | undefined; cursor?: CursorStyle | undefined; canvas?: Canvas | undefined; } & TextOptions{ title?: string | undefined; left?: number | undefined; top?: number | undefined; width?: number | undefined; height?: number | undefined; fit?: FitStyle | undefined; page?: number | undefined; background?: CSSColor | undefined; fullscreen?: boolean | undefined; borderless?: boolean | undefined; resizable?: boolean | undefined; visible?: boolean | undefined; cursor?: CursorStyle | undefined; canvas?: Canvas | undefined; } & TextOptions
skia-canvas · loadImageData(src: any, width: number, height?: number | undefined): Promise<ImageData> | (src: any, width: number, height: number, settings?: (ImageDataSettings & RequestInit) | undefined): Promise<ImageData> | (src: Sharp): Promise<ImageData>(src: any, width: number, height?: number | undefined): Promise<ImageData> | (src: any, width: number, height: number, settings?: any): Promise<ImageData> | (src: Sharp): Promise<ImageData>
skia-canvas · CanvasDrawableImage | ImageData | CanvasImage | ImageData | Canvas | CanvasRenderingContext2D
skia-canvas · FontVariantSetting"normal" | "historical-forms" | "small-caps" | "all-small-caps" | "petite-caps" | "all-petite-caps" | "unicase" | "titling-caps" | "lining-nums" | "oldstyle-nums" | "proportional-nums" | "tabular-nums" | "diagonal-fractions" | "stacked-fractions" | "ordinal" | "slashed-zero" | "common-ligatures" | "no-common-ligatures" | "discretionary-ligatures" | "no-discretionary-ligatures" | "historical-ligatures" | "no-historical-ligatures" | "contextual" | "no-contextual" | "jis78" | "jis83" | "jis90" | "jis04" | "simplified" | "traditional" | "full-width" | "proportional-width" | "ruby" | "super" | "sub…(string & {}) | FontVariantKeyword | FontVariantAlternate
skia-canvas · KeyboardEventProps{ key: string; code: string; location: number; repeat: boolean; ctrlKey: boolean; altKey: boolean; metaKey: boolean; shiftKey: boolean; }{ key: string; code: string; location: number; repeat: boolean; ctrlKey: boolean; altKey: boolean; metaKey: boolean; shiftKey: boolean; preventDefault(): void; }
skia-canvas · CanvasPatternSourceImage | CanvasImage | ImageData | Canvas | CanvasRenderingContext2D
skia-canvas · GlobalCompositeOperation"color" | "color-burn" | "color-dodge" | "copy" | "darken" | "destination-atop" | "destination-in" | "destination-out" | "destination-over" | "difference" | "exclusion" | "hard-light" | "hue" | "lighten" | "lighter" | "luminosity" | "multiply" | "overlay" | "saturation" | "screen" | "soft-light" | "source-atop" | "source-in" | "source-out" | "source-over" | "xor""clear" | "color" | "color-burn" | "color-dodge" | "copy" | "darken" | "destination" | "destination-atop" | "destination-in" | "destination-out" | "destination-over" | "difference" | "exclusion" | "hard-light" | "hue" | "lighten" | "lighter" | "luminosity" | "multiply" | "overlay" | "saturation" | "screen" | "soft-light" | "source-atop" | "source-in" | "source-out" | "source-over" | "xor"

已删除的类或接口成员

memberimport之前
Canvas.toSharpSyncskia-canvas(options?: RenderOptions | undefined): Sharp
Canvas.static contextsskia-canvasWeakMap<Canvas, readonly CanvasRenderingContext2D[]>

已修改的类或接口成员

member之前之后
App.eventLoopEventLoopModeundefined
Canvas.toURL(format: ExportFormat, options?: ExportOptions | undefined): Promise<string>(format?: ExportFormat | undefined, options?: ExportOptions | undefined): Promise<string>
Canvas.saveAs(filename: string, options?: SaveOptions | undefined): Promise<void>(filename: string | URL, options?: SaveOptions | undefined): Promise<void>
Canvas.toFile(filename: string, options?: SaveOptions | undefined): Promise<void>(filename: string | URL, options?: SaveOptions | undefined): Promise<void>
Canvas.newPage(width?: number | undefined, height?: number | undefined): CanvasRenderingContext2D(settings?: CanvasRenderingContext2DSettings | undefined): CanvasRenderingContext2D | (width?: number | undefined, height?: number | undefined, settings?: CanvasRenderingContext2DSettings | undefined): CanvasRenderingContext2D
Canvas.toBuffer(format: ExportFormat, options?: ExportOptions | undefined): Promise<Buffer>(format?: ExportFormat | undefined, options?: ExportOptions | undefined): Promise<Buffer>
Canvas.toDataURL(format: ExportFormat, quality?: number | undefined): string(format?: ExportFormat | undefined, quality?: number | undefined): string
Canvas.toURLSync(format: ExportFormat, options?: ExportOptions | undefined): string(format?: ExportFormat | undefined, options?: ExportOptions | undefined): string
Canvas.getContext(type?: "2d" | undefined): CanvasRenderingContext2D(type: "2d", settings?: CanvasRenderingContext2DSettings | undefined): CanvasRenderingContext2D | (type?: string | undefined, settings?: CanvasRenderingContext2DSettings | undefined): CanvasRenderingContext2D | null
Canvas.saveAsSync(filename: string, options?: SaveOptions | undefined): void(filename: string | URL, options?: SaveOptions | undefined): void
Canvas.constructor(width?: number | undefined, height?: number | undefined, options?: TextOptions | undefined): Canvas(width?: number | undefined, height?: number | undefined, options?: (TextOptions & CanvasBackend) | undefined): Canvas
Canvas.toBufferSync(format: ExportFormat, options?: ExportOptions | undefined): Buffer(format?: ExportFormat | undefined, options?: ExportOptions | undefined): Buffer
Canvas.toDataURLSync(format: ExportFormat, options?: ExportOptions | undefined): string(format?: ExportFormat | undefined, options?: ExportOptions | undefined): string
Path2D.points(step?: number | undefined): readonly [x: number, y: number][](step?: number | undefined, mode?: "even" | "exact" | undefined): readonly [x: number, y: number][]
Window.backgroundstringCSSColor
DOMMatrix.setMatrixValue(transformList: string): DOMMatrix(transformList: TransformString): DOMMatrix
ImageData.dataUint8ClampedArray<ArrayBufferLike>any
ImageData.colorSpace"srgb"ColorSpace
SaveOptions.mattestring | undefinedCSSColor | undefined
CanvasFilters.filterstring(string & {}) | "none" | FilterFunction
EngineDetails.api"Vulkan" | "Metal""Vulkan" | "Metal" | null
EngineDetails.errorstring | undefinedstring | null | undefined
ExportOptions.mattestring | undefinedCSSColor | undefined
RenderOptions.mattestring | undefinedCSSColor | undefined
CanvasGradient.addColorStop(offset: number, color: string): void(offset: number, color: CSSColor): void
CanvasDrawImage.drawCanvas(image: Canvas, dx: number, dy: number): void | (image: Canvas, dx: number, dy: number, dw: number, dh: number): void | (image: Canvas, sx: number, sy: number, sw: number, sh: number, dx: number, dy: number, dw: number, dh: number): void(image: CanvasDrawable, dx: number, dy: number): void | (image: CanvasDrawable, dx: number, dy: number, dw: number, dh: number): void | (image: CanvasDrawable, sx: number, sy: number, sw: number, sh: number, dx: number, dy: number, dw: number, dh: number): void
ImageDataSettings.colorSpace"srgb" | undefinedColorSpace | undefined
CanvasShadowStyles.shadowColorstringCSSColor
CreateTextureOptions.colorstring | undefinedCSSColor | undefined
CanvasFillStrokeStyles.fillStylestring | CanvasPattern | CanvasGradient | CanvasTextureCSSColor | CanvasPattern | CanvasGradient | CanvasTexture
CanvasFillStrokeStyles.strokeStylestring | CanvasPattern | CanvasGradient | CanvasTextureCSSColor | CanvasPattern | CanvasGradient | CanvasTexture
CanvasFillStrokeStyles.createPattern(image: CanvasPatternSource, repetition: string | null): CanvasPattern | null(image: CanvasPatternSource, repetition: "" | PatternRepeat | null): CanvasPattern | null
CanvasTextDrawingStyles.fontStretchCanvasFontStretch(string & {}) | CanvasFontStretch
ImageDataExportSettings.mattestring | undefinedCSSColor | undefined
ImageDataExportSettings.colorSpace"srgb" | undefinedColorSpace | undefined
CanvasRenderingContext2D.filterstring(string & {}) | "none" | FilterFunction
CanvasRenderingContext2D.fillStylestring | CanvasPattern | CanvasGradient | CanvasTextureCSSColor | CanvasPattern | CanvasGradient | CanvasTexture
CanvasRenderingContext2D.drawCanvas(image: Canvas, dx: number, dy: number): void | (image: Canvas, dx: number, dy: number, dw: number, dh: number): void | (image: Canvas, sx: number, sy: number, sw: number, sh: number, dx: number, dy: number, dw: number, dh: number): void(image: CanvasDrawable, dx: number, dy: number): void | (image: CanvasDrawable, dx: number, dy: number, dw: number, dh: number): void | (image: CanvasDrawable, sx: number, sy: number, sw: number, sh: number, dx: number, dy: number, dw: number, dh: number): void
CanvasRenderingContext2D.fontStretchCanvasFontStretch(string & {}) | CanvasFontStretch
CanvasRenderingContext2D.outlineText(text: string, maxWidth?: number | undefined): Path2D(text: string, maxWidth?: number | undefined): Path2D | null
CanvasRenderingContext2D.shadowColorstringCSSColor
CanvasRenderingContext2D.strokeStylestring | CanvasPattern | CanvasGradient | CanvasTextureCSSColor | CanvasPattern | CanvasGradient | CanvasTexture
CanvasRenderingContext2D.createPattern(image: CanvasPatternSource, repetition: string | null): CanvasPattern | null(image: CanvasPatternSource, repetition: "" | PatternRepeat | null): CanvasPattern | null
CanvasRenderingContext2D.textDecorationstringTextDecorationSetting

新增弃用

export@deprecated
skia-canvas · App.eventLoopEvent loop modes have been removed: the node event loop is now always available

要求变化（engines、peer 依赖）

未发现。

新增导出 (30)
importexportkind
skia-canvasCSSColortype
skia-canvasPngFilterstype
skia-canvasloadCanvasfunction
skia-canvasFontFeatureinterface
skia-canvasFontInstanceinterface
skia-canvasCanvasBackendinterface
skia-canvasColorFunctiontype
skia-canvasPatternRepeattype
skia-canvasFilterFunctiontype
skia-canvasImageDataArraytype
skia-canvasPolarColorSpacetype
skia-canvasTransformStringtype
skia-canvasImageLoadOptionstype
skia-canvasCanvasFontKerningtype
skia-canvasCanvasLoadOptionstype
skia-canvasFontVariationAxisinterface
skia-canvasPointerEventPropstype
skia-canvasTransformFunctiontype
skia-canvasFontVariantKeywordtype
skia-canvasCanvasTextRenderingtype
skia-canvasImageRequestOptionstype
skia-canvasFontVariantAlternatetype
skia-canvasCompositionEventPropstype
skia-canvasRectangularColorSpacetype
skia-canvasTextDecorationKeywordtype
skia-canvasTextDecorationSettingtype
skia-canvasHueInterpolationMethodtype
skia-canvasColorInterpolationMethodtype
skia-canvasCoalescedPointerEventPropstype
skia-canvasCanvasRenderingContext2DSettingsinterface

把这些数据交给你的 AI 智能体

Vigia 是免费的 MCP 服务器：你的编程智能体在写代码之前就能检查版本、不兼容变更和安全漏洞。无需注册，无需 API 密钥。

claude mcp add --transport http vigia https://vigia.coredls.cloud/mcp

添加到 Cursor添加到 VS Code★ 在 GitHub 上加星

任何其他 MCP 客户端
{ "mcpServers": { "vigia": { "url": "https://vigia.coredls.cloud/mcp" } } }

智能体技能（SKILL.md）：告诉智能体何时使用 Vigia · 用于拉取请求的 GitHub Action

常见问题

将 skia-canvas 从 3 升级到 4 有哪些不兼容变更？

在 skia-canvas 3.0.8 与 4.0.0 之间，Vigia 发现 0 个已删除的导出、13 个已修改的签名，以及 46 个已删除或修改的类或接口成员。

skia-canvas 4 中弃用了哪些内容？

skia-canvas 4.0.0 中有 1 个导出或成员新被标记为弃用。

供智能体使用

GET https://vigia.coredls.cloud/v1/packages/npm/skia-canvas/upgrade?from=3.0.8&to=4.0.0