fix: experimentally swap napi-rs/canvas to canvas

This is an EXPERIMENTAL pull request to see if swapping the libs would fix the issue where badges text is not measured correctly.

Continuation of npmx-dev#1584

Author: wojtekmaj

package.json

@@ -61,7 +61,6 @@
     "@iconify-json/vscode-icons": "1.2.43",
     "@intlify/shared": "11.2.8",
     "@lunariajs/core": "https://pkg.pr.new/lunariajs/lunaria/@lunariajs/core@904b935",
-    "@napi-rs/canvas": "0.1.94",
     "@nuxt/a11y": "1.0.0-alpha.1",
     "@nuxt/fonts": "0.14.0",
     "@nuxt/scripts": "0.13.2",
@@ -83,6 +82,7 @@
     "@vueuse/router": "^14.2.1",
     "@vueuse/shared": "14.2.1",
     "algoliasearch": "5.49.0",
+    "canvas": "^3.2.1",
     "defu": "6.1.4",
     "fast-npm-meta": "1.2.1",
     "focus-trap": "^8.0.0",

pnpm-lock.yaml

@@ -17,6 +17,7 @@ ignoredBuiltDependencies:
 onlyBuiltDependencies:
   - '@resvg/resvg-js'
   - better-sqlite3
+  - canvas
   - sharp@0.34.5
   - simple-git-hooks@2.13.1
 

pnpm-workspace.yaml

@@ -1,5 +1,5 @@
 import * as v from 'valibot'
-import { createCanvas, type SKRSContext2D } from '@napi-rs/canvas'
+import { createCanvas, type CanvasRenderingContext2D } from 'canvas'
 import { hash } from 'ohash'
 import { createError, getRouterParam, getQuery, setHeader } from 'h3'
 import { PackageRouteParamsSchema } from '#shared/schemas/package'
@@ -45,9 +45,9 @@ const SHIELDS_LABEL_PADDING_X = 5
 const BADGE_FONT_SHORTHAND = 'normal normal 400 11px Geist, system-ui, -apple-system, sans-serif'
 const SHIELDS_FONT_SHORTHAND = 'normal normal 400 11px Verdana, Geneva, DejaVu Sans, sans-serif'
 
-let cachedCanvasContext: SKRSContext2D | null | undefined
+let cachedCanvasContext: CanvasRenderingContext2D | null | undefined
 
-function getCanvasContext(): SKRSContext2D | null {
+function getCanvasContext(): CanvasRenderingContext2D | null {
   if (cachedCanvasContext !== undefined) {
     return cachedCanvasContext
   }