Question

我有以下代码：

App.js

...
import {sortData, prettyPrintStat} from 'util/util';
...
<div className="app__stats">
<InfoBox 
  isRed
  active={casesType === 'cases'}
  onClick={e => setCasesType('cases')}
  title="Cases" 
  cases={prettyPrintStat(countryInfo.todayCases)} 
  total={prettyPrintStat(countryInfo.cases)}/>
...

util.js

...
export const sortData = (data) => {
    const sortedData = [...data];
    sortedData.sort((a, b) => {
        if (a.cases > b.cases) {
            return -1;
        }
        else{
            return 1
        }
    });
    return sortedData;
};
export const prettyPrintStat = (stat) => {
    return stat ? `+${numeral(stat).format("0.0a")}` : "+0"
};
...

对于绝对导入，我已按如下方式实现了 jsconfig 文件

jsconfig.json

{
    "compilerOptions": {
      "baseUrl": "./src"
    }
}

运行时出现错误提示

TypeError: Object(...) is not a function

附上错误截图。 Screenshot of the error

我尝试了一些来自网络的解决方案，例如将 React 和 React-DOM 更新到最新版本。还尝试删除 node_modules 文件夹并重新安装。他们似乎都没有任何帮助。

但是，如果我删除绝对导入实现并使用以下代码，一切似乎都正常

App.js

...
import {sortData, prettyPrintStat} from './util/util';
...

谁能帮我弄清楚出了什么问题？

谢谢

Answer 1

我能够通过将我的 util 文件重命名为 helper.js 来解决这个问题

例如

import { prettyPrintStat, sortData } from 'util/helper'

代替

import { prettyPrintStat, sortData } from 'util/util'

ReactJS 错误 - 实现绝对导入后“TypeError: Object(...) is not a function”

1 个答案: