[Vercel] Error creating chart image – Error: Cannot find module 'canvas'
See original GitHub issueHello, I assume this is an error related to node-canvas
but I’m not able to fix it with my NextJS application.
Everything works locally but when deploying to Vercel, the function starts to fail.
Full error log:
ERROR Error creating chart image Error: Cannot find module 'canvas'
Require stack:
- /var/task/node_modules/chartjs-node-canvas/dist/freshRequire.js
- /var/task/node_modules/chartjs-node-canvas/dist/index.js
- /var/task/.next/serverless/pages/articulos/[id].js
- /var/task/now__launcher.js
- /var/runtime/UserFunction.js
- /var/runtime/index.js
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:831:15)
at Function.resolve (internal/modules/cjs/helpers.js:80:19)
at Object.freshRequire (/var/task/node_modules/chartjs-node-canvas/dist/freshRequire.js:5:34)
at new CanvasRenderService (/var/task/node_modules/chartjs-node-canvas/dist/index.js:19:39)
at createChartImage (/var/task/.next/serverless/pages/articulos/[id].js:1874:33)
at getServerSideProps (/var/task/.next/serverless/pages/articulos/[id].js:1957:37)
at processTicksAndRejections (internal/process/task_queues.js:97:5)
at async renderToHTML (/var/task/node_modules/next/dist/next-server/server/render.js:39:215)
at async renderReqToHTML (/var/task/.next/serverless/pages/articulos/[id].js:1136:22)
at async render (/var/task/.next/serverless/pages/articulos/[id].js:1253:22) {
code: 'MODULE_NOT_FOUND',
requireStack: [
'/var/task/node_modules/chartjs-node-canvas/dist/freshRequire.js',
'/var/task/node_modules/chartjs-node-canvas/dist/index.js',
'/var/task/.next/serverless/pages/articulos/[id].js',
'/var/task/now__launcher.js',
'/var/runtime/UserFunction.js',
'/var/runtime/index.js'
]
}
As far as I’m aware of, Vercel uses Amazon Linux 2 and I got the packages to install from node-canvas wiki for Fedora. Therefore I updated the install command for my project to run:
yum install gcc-c++ cairo-devel libjpeg-turbo-devel pango-devel giflib-devel && npm install
It looks like it installs everything correctly but the same error persists. Any clue on how to get it working correctly?
Issue Analytics
- State:
- Created 3 years ago
- Comments:5 (2 by maintainers)
Top Results From Across the Web
Error: Cannot find module 'canvas' - Chart.js - Stack Overflow
open New terminal and write npm command to install module which is chartjs-node-canvas npm install canvas npm install chartjs-node-canvas.
Read more >Curve fitting for charts: better visualizations for Vercel Analytics
It is difficult to find trends in a graph with a lot of noise. ... The smaller the error is, the better the...
Read more >cannot find module 'elasticsearch' from 'setup-jest.js' - You.com
How do I resolve "Cannot find module" error using Node.js? ... Hi, I am creating a project with AJS2, Typescript and SystemJS currently....
Read more >How to fix error TS7016: Could not find a declaration file for ...
Try `npm install @types/XYZ` if it exists or add a new declaration (.d. · declare module 'XYZ';. Lastly, you also need to add...
Read more >[Solved]-I can't reference an image in Next.js-Reactjs
npm install --save next-images. or. yarn add next-images. Step 2 // Create next.config.js const withImages = require('next-images') module.exports ...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
Hello, I got the same error when deploying a serverless function in vercel, but I found a workaround.
This works for me.
The following repository is a sample. https://github.com/karintou8710/vercel-chartjs-node-canvas
Hmm, wonder if that is some kind of tree-shaking thing? weird. Thanks for posting your fix!