React Component ESLint 说首选默认导出

Question

我的组件上的 ESLint 不断收到此错误。

ESLint：表示首选默认导出 (import/prefer-default-export)

这是组件的外观

export class mycomponent extends React.Component {

  render() {

    //stuff here

  }
}

它要求什么？我该如何解决这个问题？

Answer 1

您需要像这样将导出指定为默认值：

export default class mycomponent extends React.Component {

  render() {

    //stuff here

  }
}

（注意添加的单词 default），然后在其他文件中您可以导入您的组件：

import mycomponent from './mycomponent.js';

假设组件包含在同一目录中并在文件 mycomponent.js.

中定义

如果您的文件包含多个具有以下名称的导出内容，您也可以避免默认导出：

export const foo = 'foo';
export const bar = 'bar';

或者您甚至可以完全保留原始文件而没有单词 default 并使用批量导入来导入它：

import * as mycomponent from './mycomponent.js';

React Component ESLint says Prefer Default Export