GLIBC version errors after upgrading to Node 20 on Vercel, NEXTJS 12

Help
1

Summary

Since Node 16 was discontinued on Vercel, we upgraded our web app to Node 20. However, we encountered the following build error:

Error: /lib64/libc.so.6: version `GLIBC_2.28' not found (required by /vercel/path0/node_modules/canvas/build/Release/libglib-2.0.so.0)
    at Module._extensions..node (node:internal/modules/cjs/loader:1460:18)
    at Module.load (node:internal/modules/cjs/loader:1203:32)
    at Module._load (node:internal/modules/cjs/loader:1019:12)
    at Module.require (node:internal/modules/cjs/loader:1231:19)
    at require (node:internal/modules/helpers:177:18)
    at Object.<anonymous> (/vercel/path0/node_modules/canvas/lib/bindings.js:3:18)
    at Module._compile (node:internal/modules/cjs/loader:1364:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1422:10)
    at Module.load (node:internal/modules/cjs/loader:1203:32)
    at Module._load (node:internal/modules/cjs/loader:1019:12) {
  code: 'ERR_DLOPEN_FAILED'
}
> Build error occurred
Error: Failed to collect page data for /[page]
    at /vercel/path0/node_modules/next/dist/build/utils.js:916:15 {
  type: 'Error'
}

To resolve this, we followed an online discussion and installed “canvas”: “^3.0.0-rc3”. This allowed the build to succeed.

However, we are now facing a runtime error, and the entire app appears as a black screen. The logs show:

node: /var/task/node_modules/canvas/build/Release/libstdc++.so.6: version `GLIBCXX_3.4.29' not found (required by node)
node: /var/task/node_modules/canvas/build/Release/libstdc++.so.6: version `GLIBCXX_3.4.26' not found (required by node)
Node.js process exited with exit status: 1. The logs above can help with debugging the issue

App Details:
Framework: Next.js 12
Libraries Used: Fabric.js, react-sketch-canvas, Konva.js

Observations & Questions:
Build works fine on local with same node version (20) and Based on our investigation, this issue seems to be caused by react-sketch-canvas, which depends on canvas.
Our main concern is: Why is this being built or imported on the server side?
We have explicitly marked the files importing react-sketch-canvas with “use client” and dynamically importing the lib, yet the issue persists, it was working fine on node 16 version.
Any insights on how to resolve this issue would be greatly appreciated!