需要帮助修复使用 React.js 的 SparkLine 组件的导入错误

Question

尝试运行我的项目时收到 4 个错误，即使我已经安装了依赖项并具有正确的导入语句，但似乎无法识别 SparkLineComponent。我已经提供了我的代码/错误的屏幕截图。

()（这些是我尝试运行项目时收到的错误）

import React from 'react';
import { SparklineComponent, Inject, SparklineTooltip } from '@syncfusion/ej2-react-charts';

const SparkLine = ({ id,height,width,color,data,type,currentColor }) => {
    return (
        <SparklineComponent
        id={id}
        height={height}
        width={width}
        lineWidth={1}
        valueType="Numeric"
        fill={color}
        border={{ color: currentColor, width: 2 }}
        dataSource={data}
        xName="x"
        yName="y" 
        >
            <Inject services={[SparklineTooltip]} />
        </SparklineComponent>
    )
}

export default SparkLine

我正在创建一个电子商务管理仪表板应用程序，并尝试实现图表来查看收入和经济进展。

Answer 1

在我的环境中运行代码时没有任何问题，因此看起来是模块的问题。

潜在的解决方案

1. 我确信你已经这样做了，但以防万一，请仔细检查你运行的情况 这是在终端中：

   npm 安装@syncfusion/ej2-react-charts --save

2. 确保您安装的文件夹是正确的 工作区（我确信你也这样做了，但只是仔细检查）

3. （重新安装库）删除所有节点模块，然后按顺序运行这两个命令：

   npm install

   &

   npm update

4. 重新加载您的 IDE（也称为关闭并重新打开）

5. 如果问题仍然存在，可能是您的节点设置或版本 - 较新的节点版本不支持 ES6 模块，因此您必须 require vs import。