找不到模塊：無法解析“@reactchartjs/react-chart-2.js”

Question

我正在嘗試使用我安裝的模塊react-chartjs-2來實現此圖表：

npm 安裝 --save react-chartjs-2 chart.js

所以我在package.json中有這個：

  "chart.js": "^2.9.4",
  "react-chartjs-2": "^2.11.1"

我從github復制了圖表代碼：

import React from 'react'
import { Line } from '@reactchartjs/react-chart.js'

const data = {
  labels: ['1', '2', '3', '4', '5', '6'],
  datasets: [
    {
      label: '# of Votes',
      data: [12, 19, 3, 5, 2, 3],
      fill: false,
      backgroundColor: 'rgb(255, 99, 132)',
      borderColor: 'rgba(255, 99, 132, 0.2)',
    },
  ],
}

const options = {
  scales: {
    yAxes: [
      {
        ticks: {
          beginAtZero: true,
        },
      },
    ],
  },
}

const LineChart = () => (
  <>
    <div className='header'>
      <h1 className='title'>Line Chart</h1>
      <div className='links'>
        <a
          className='btn btn-gh'
          href='https://github.com/reactchartjs/react-chartjs-2/blob/react16/example/src/charts/Line.js'
        >
          Github Source
        </a>
      </div>
    </div>
    <Line data={data} options={options} />
  </>
)

export default LineChart

但是，我不斷收到此錯誤：

找不到模塊：無法解析“@reactchartjs/react-chart-2.js”

知道我做錯了什么嗎？

Answer 1

萬一有人遇到同樣的錯誤，只需這樣做：

import { Line } from "react-chartjs-2";

Answer 2

我有同樣的問題，這對我有用。

yarn add react-chartjs-2  chart.js

由於某種原因， npm沒有工作。

Answer 3

發生此問題是由於 npm 沒有正確安裝 package

紗線添加 react-chartjs-2 chart.js -.network-timeout 1000000000

---

這對我有用

Answer 4

import { Bar,Line } from "react-chartjs-2/dist";