Question

我目前正在使用JSX构建React应用，并且从ESLint中收到以下错误：

ESLint：在“ ./TopBar”（导入/命名）中找不到TopBarClass

这是产生错误的文件外观。

import React from 'react';

import { TopBarClass } from './TopBar';

export default class Game extends React.Component {

  render() {
    const { state } = this.state;
    return (
      <div id="game-inner-container">
        { TopBarClass({ isMobileOrSmall: state.isMobileOrSmall }) }
      </div>
    );
  }

}

但是在我的TopBar.js内部，我得到了以下信息：

import React from 'react';

export default class TopBarClass extends React.Component {

}

Answer 1

更改

import { TopBarClass } from './TopBar';

收件人

import TopBarClass from './TopBar';

您使用的是默认导出，因此应在不使用{ / }

的情况下进行导入

或者您可以将export default更改为仅export，然后{ / }中的内容应与组件名称匹配。

Answer 2

您需要以正确的方式使用导入，如下所示

import TopBarClass  from './TopBar';

它将正常工作。

ESLint：在“ ./TopBar”（导入/命名）中找不到TopBarClass

2 个答案: