Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Can't resolve 'canvas' on next.js serverless app

See original GitHub issue

What’s the problem

I built a next.js application with serveless option, but simply importing this library it throws this error:

Failed to compile.
ModuleNotFoundError: Module not found: Error: Can't resolve 'canvas' in '/.../node_modules/jsdom/lib/jsdom'
> Build error occurred

I already tried to add canvas library but this doesn’t fix the problem and it throws another error.

Step to reproduce

Add to next.config.js:

module.exports = {
  target: 'serverless'

Run next build

Basic Info:

  • “isomorphic-dompurify”: “^0.12.0”,
  • “next”: “^10.0.8”,
  • “react”: “^17.0.1”,
  • “react-dom”: “^17.0.1”

This issue could be related to #35 , but i don’t use umijs.

Issue Analytics

  • State:open
  • Created 2 years ago
  • Comments:13 (6 by maintainers)

github_iconTop GitHub Comments

DePasqualeOrgcommented, Sep 24, 2022

I was also having this issue with SvelteKit using the Node adapter. Installing canvas solved the issue, but it would be nice if there were also a solution for serverless.

eharkinscommented, Apr 28, 2021

@EnricoNapolitan did you find a solution? I’m encountering something similar with Gatsby.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Nextjs deploy error after installing remark-prism package
After installing remark-prism, I get this deploy error: ModuleNotFoundError: Module not found: Error: Can't resolve 'canvas' in ...
Read more >
The module you're trying to import uses Node. js specific modules, for example dns , outside of getStaticProps / getStaticPaths / getServerSideProps.
Read more >
Node Canvas on Vercel Serverless Function
I'm generating images on the server based on data users send to the API route I have in Next.js using the canvas package....
Read more >
Serverless Nextjs Plugin
It is the component's job to deploy your application ensuring parity with all of next's features we know and love. We try to...
Read more >
Simple drawing canvas on your browser using HTML canvas and Nextjs. ... Actions Projects Security Insights New issue Can't resolve 'canvas' on next....
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Post

No results found

github_iconTop Related Hashnode Post

No results found