@aphrody/canvas

中文文档
1.4.7发布于 2026/10/23MITTypeScriptES Module零依赖近 30 天下载 2222

@napi-rs/canvas 运行时间

中文使用文档
文档目录7 节
  1. 入境点
  2. 原生 Skia 二进制
  3. M3场景
  4. 版式和上游
  5. 上游更新
  6. 验证
  7. 出版

@aphrody/ canvas (英语)

Apprody的帆布包:一个马厩 @aphrody/* 位于被钉住的上游 Skia 上的命名空间 运行时间 @napi-rs/canvas (1.0.9,实施 8411071, (中文(简体) ), 加上M3包、SpaceUI、Tauri和制成箱所使用的M3表面合同. 进口消费者 @aphrody/canvas 从不依赖 @napi-rs/canvas 直接说.

bun add @aphrody/canvas   # Bun >= 1.4.2

入境点

导入原生添加剂目录
@aphrody/canvas导入时装入上游API(createCanvas, (中文(简体) ), loadImage, (中文(简体) ), Image, (中文(简体) ), GlobalFonts, (中文(简体) ), Path2D, (中文(简体) ), SKRSContext2D,(......), loadNativeCanvas(), (中文(简体) ), createNativeCanvas(), (中文(简体) ), loadNativeImage(), (中文(简体) ), drawM3Scene(), (中文(简体) ), drawM3Scene3d() 和现场合同.
@aphrody/canvas/site永远createM3CanvasSurface(), (中文(简体) ), createBrowserCanvas(), (中文(简体) ), configureBrowserCanvas(), (中文(简体) ), selectCanvasBackend()。 。 。 .
@aphrody/canvas/browser永远模块与 /site。 。 。 .
import { createCanvas, GlobalFonts, type SKRSContext2D } from "@aphrody/canvas";

const canvas = createCanvas(320, 120);
const ctx: SKRSContext2D = canvas.getContext("2d");
ctx.fillRect(0, 0, 320, 120);
const png = await canvas.encode("png"); // also "webp", "avif", "jpeg"

aphrody-site 和浏览器捆绑必须使用本地自由的入口,因此Skia addon永远不会 到达站点捆绑 :

import {
  createBrowserCanvas,
  createM3CanvasSurface,
} from "@aphrody/canvas/site";

包件船 TypeScript 源为 Bun ("default" 和手写 声明"types" anext.js 的消费者 /site 在 transpilePackages。 。 。 .

原生 Skia 二进制

附加由上游装载机解决(vendor/js-binding.js),第一场比赛获胜:

  1. NAPI_RS_NATIVE_LIBRARY_PATH: 到 a 的绝对路径 skia.<platform>.node,例如,一个 由Apprody从 third_party/canvas当设定时,它是唯一的候选人.
  2. vendor/skia.<platform>.node 在装载器旁边(被基特所忽略,从未犯过).
  3. 上游预建软件包 @napi-rs/canvas-<platform>@1.0.9,在 optionalDependencies软件包管理器跳过 os编号 :cpu 不符合 主机( 装入器在 Linux 上取出) gnu 或者说 musl 运行时间 : win32-x64-msvc, (中文(简体) ), win32-arm64-msvc, (中文(简体) ), linux-x64-gnu, (中文(简体) ), linux-x64-musl, (中文(简体) ), linux-arm64-gnu, (中文(简体) ), linux-arm64-musl, (中文(简体) ), linux-arm-gnueabihf, (中文(简体) ), linux-riscv64-gnu, (中文(简体) ), darwin-x64, (中文(简体) ), darwin-arm64, (中文(简体) ), android-arm64。 。 。 .

optionalDependencies 从 third_party/canvas/npm/* 在销售版本,所以 javaScript 加载器和二进制总是来自相同的上游放出.

M3场景

drawM3Scene() 财务报告和审定财务报表 drawM3Scene3d() 将 Rust 的 M3 场景光化(aphrody_render,通过 @aphrody/bun)并用土生土长的塞通给巴布亚新几内亚人抹黑. @aphrody/bun 是可选对等点 依赖性:仅在这两个函数之一运行时导入,并缺失安装 掷出 @aphrody/canvas: drawM3Scene needs the optional peer dependency @aphrody/bun。场景 类型(M3Scene, (中文(简体) ), M3Scene3d, (中文(简体) ), M3Render3dPolicy)来自 scene-types.d.ts,副本 packages/bun/src/scene-types.ts,所以类型检查从不需要 @aphrody/bun。 。 。 .

版式和上游

third_party/canvas 是一个位于非叉子上游的Git子模块,从未设置; 假面或拉斯特的货箱里都有类似的行为 软件包需要的文件 从其他树上取出副本 :

路径来源
vendor/index.js, (中文(简体) ), js-binding.js, (中文(简体) ), geometry.js, (中文(简体) ), load-image.js, (中文(简体) ), index.d.ts, (中文(简体) ), LICENSEthird_party/canvas (MIT,上游版权通知保存)
vendor/package.json{"type": "commonjs"}:上游加载器为普通JS,此包为无害环境管理
vendor/UPSTREAM.md证明:每份文件的提交、版本、执照、SHA-256
scene-types.d.tspackages/bun/src/scene-types.ts

复制品是按装包时间录制的:

  • bun test,类型检查和每个工作空间 消费者从一个简单的检查,没有 建立阶梯,而不初始化子模块;
  • 公布的柏油球正是被审查的树(files 列出每个已运出路径;
  • 漂移仍然无法发表: scripts/vendor-upstream.ts --check 运行为 prepack (如果子模块缺失则失败),以及 vendor.test.ts 将每份副本与来源进行比较 当子模块被检查出来时,并使用SHA-256英寸 vendor/UPSTREAM.md 否则.

副本在连接LF的线下正常化后为同名字节.

上游更新

git -C third_party/canvas fetch && git -C third_party/canvas checkout <reviewed-sha>
cd packages/canvas
bun run vendor            # rewrites vendor/, scene-types.d.ts and optionalDependencies
# keep aphrodyCanvasVersion in site.ts, site.d.ts and index.d.ts equal to the
# package version (the release-aligned Aphrody version), then run the gates below

验证

cd packages/canvas
bun test                  # contract, native encode (PNG/WebP/AVIF), vendor drift, manifest
bun run typecheck         # sources, then published declarations with skipLibCheck: false
bun run lint && bun run format:check
bun run vendor:check
bun pm pack --destination <dir>

林特和格式检查使用 Bun 的本地 bun lint 财务报告和审定财务报表 bun fmt 命令 直接,无 bunx,独立的Oxc工具,或子进程后端.

出版

.github/workflows/release-m3-packages.yml 发布此软件包之前 @aphrody/material-web (这取决于它) 当一个 m3-v* 标记被推出 。 名单存有 没有 workspace: 或者说 catalog: 说明,所以包装 package.json 是登记 package.json由所有者操作的手动等同器:

cd packages/canvas && bun publish --access public --tag latest --registry https://registry.npmjs.org

版本与发布记录

@aphrody/canvas 共发布 7 个版本,首次发布于 2026/06/04;过去 12 个月发布了 7 个版本。

版本发布日期距今
1.4.7latest2026/10/2315 天前
1.0.9-aphrody.62026/10/1028 天前
1.0.9-aphrody.52026/10/0929 天前
1.0.9-aphrody.42026/10/071 个月前
1.0.9-aphrody.32026/10/051 个月前
1.0.9-aphrody.22026/09/241 个月前

关于 @aphrody/canvas 的常见问题

@aphrody/canvas 是什么?

@napi-rs/canvas 运行时间

如何安装 @aphrody/canvas?

在项目目录运行 npm install @aphrody/canvas,或使用 pnpm add / yarn add / bun add。

@aphrody/canvas 支持 TypeScript 吗?

支持。包内自带 TypeScript 类型声明(package.json 声明了 types 入口),安装后即可获得类型提示,无需再安装 @types 包。

@aphrody/canvas 支持 ESM 还是 CommonJS?

以 ES Module 形式发布,推荐使用 import 引入。在 CommonJS 项目中,Node.js 20.19+ / 22.12+ 可以直接 require() 不含顶层 await 的 ES Module,更早的版本需要改用动态 import()。

@aphrody/canvas 可以商用吗?

@aphrody/canvas 使用 MIT 许可。宽松许可:允许商业使用、修改和再分发,通常只需在分发时保留原版权与许可声明。以上为概括,不构成法律意见,请以许可原文为准。

@aphrody/canvas 的下载量有多少?

根据 npm 官方下载统计,@aphrody/canvas 在 2026/10/06 – 2026/11/04 这 30 天内被下载 2,222 次,日均约 74 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入,适合横向比较热度,不能直接等同于使用人数。

@aphrody/canvas 还在维护吗?

最新版本 1.4.7 发布于 2026/10/23(15 天前);至今共发布 7 个版本,其中过去 12 个月发布了 7 个;首次发布于 2026/06/04。发布频率只是参考信号:功能稳定的工具可能很少需要更新,建议结合源码仓库的 issue 和提交记录判断。