[Bug]: Import Error (Cannot Find Module)

Would you like to work on a fix?

• Check this if you would like to implement a PR, we are more than happy to help you go through the process.

Current and expected behavior

I’m using chart.js 4.0.0 and react-chartjs-2 5.0.1 but when I try to import the module, it shows error that the module is not found.

import React from "react";
import { Chart } from 'react-chartjs-2';
import { Chart as ChartJS, LineController, LineElement, PointElement, LinearScale, Title } from 'chart.js';

ChartJS.register(LineController, LineElement, PointElement, LinearScale, Title);


function LineChart({ chartData }) {
  return (
    <div className="chart-container">
      <h2 style={{ textAlign: "center" }}>Line Chart</h2>
      <Chart
        type='line'
        data={chartData}
        options={{
          plugins: {
            title: {
              display: true,
              text: "Test Data 2016-2020"
            },
            legend: {
              display: false
            }
          }
        }}
      />
    </div>
  );
}

export default LineChart

Reproduction

install chart.js v4.0.0 and react-chartjs-2 v5.0.1

try to import {Line} from “react-chartjs-2”; in any js files and error module not found will appear

chart.js version

v4.0.0

react-chartjs-2 version

v.5.0.1

Possible solution

No response

[bonbonsiregar]

It seems that I have to downgrade both chart.js and react-chartjs-2 to previous version, chartjs to v3.9.1 and react-chartjs-2 to 4.3.1 in order for it to work.

while using the latest version of chart.js and react-chartjs-2 require a modification in package,json, I think so. here

[scottodea]

I’m also having this issue