CODEWITHSUNDEEP
javascriptnode.jsangularchart.js
Mosky
Mosky

Reputation: 33

Error: Cannot find module 'canvas' - Chart.js

I'm using chartjs-node-canvas with chartjs to render a graph config as an image, so after installing it I tried the following :

import { ChartJSNodeCanvas } from 'chartjs-node-canvas';
const chartCallback = (ChartJS) => {
  ChartJS.defaults.global.elements.rectangle.borderWidth = 2;
};
const canvasRenderService = new ChartJSNodeCanvas({
  width,
  height,
  chartCallback,
});

But I get the following error when I'm creating a new ChartJSNodeCanvas :

Error: Cannot find module 'canvas'
at Function.webpackEmptyContext [as resolve] (http://localhost:4200/main.js:131373:10)
at freshRequire (http://localhost:4200/main.js:21530:69)
at new ChartJSNodeCanvas (http://localhost:4200/main.js:21592:50)
at ChartImageService._callee2$ (http://localhost:4200/main.js:127066:39)
at tryCatch (http://localhost:4200/main.js:115133:17)
at Generator.invoke [as _invoke] (http://localhost:4200/main.js:115347:22)
at Generator.next (http://localhost:4200/main.js:115185:21)
at http://localhost:4200/main.js:127002:67
at new ZoneAwarePromise (http://localhost:4200/polyfills.js:7278:21)
at __awaiter (http://localhost:4200/main.js:126981:10) {code: 'MODULE_NOT_FOUND', stack: 'Error: Cannot find module 'canvas'
at Fun…ter (http://localhost:4200/main.js:126981:10)', message: 'Cannot find module 'canvas''}

I tried to npm install again, npm rebuild, delete package-lock.json... but it doesn't work. Any ideas ?

I'm using Angular with Electronjs

Upvotes: 3

Views: 13008

Answers (3)

funerr
funerr

Reputation: 8156

I made a blank canvas module, it seems to work.

  1. Edit package.json:
  "dependencies": {
    "canvas": "file:./src/lib/canvas",
    "jsdom": "^21.1.1",
  1. Create a directory canvas in that path and index.ts/js with:
module.exports = {};
  1. npm i
  2. Run the app.

The solution originates from here.

Upvotes: 1

Akash Tripathi
Akash Tripathi

Reputation: 29

open New terminal and write npm command to install module which is chartjs-node-canvas

npm install canvas 
npm install chartjs-node-canvas

Upvotes: 1

uminder
uminder

Reputation: 26150

On https://www.npmjs.com/package/chartjs-node-canvas, there's the following note:

Node JS version

This is limited by the upstream dependency canvas.

Therefore, your problem should be solved if you run the following commands:

npm install canvas
npm rebuild

Upvotes: 3

Related Questions