0

I'm new to React. I'm trying to use charjs as a react component.

as soon as I add the following import statement, I get a runtime error:

import { Bar } from 'react-chartjs-2';

runtime error:

enter image description here

The component compiles and causes the above error?

component code:

import React from 'react';
import { Bar } from 'react-chartjs-2';

const BarChart = () => {
    return (
        <div>
            Bar Chart
        </div>
    )
}

export default BarChart

What am I doing wrong?

afshin
  • 1,783
  • 7
  • 22
  • 39

1 Answers1

1

Figured out the issue. chart.js was just upgraded from version 2.x to 3.x - there are several breaking changes that react-chartjs-2 is not yet updated with. I downgraded chart.js version to 2.9.4 and got it to work:

 npm install chart.js@2.9.4
afshin
  • 1,783
  • 7
  • 22
  • 39