首选默认导出eslint错误

Question

我得到这个eslint错误:

首选默认导出

import React, { Component } from 'react';

class HomePage extends Component {
  render() {
    return (
      <div className="Section">HomePage</div>
    );
  }
}

export { HomePage };

我试过做: export { default as Homepage };

然后我得到一个致命的解析错误.

然后我把它改为:

export default HomePage;

这清除了夹板错误.

但随后抛出:

'./HomePage'不包含名为'HomePage'的导出.

因为我这样调用HomePage: import { HomePage } from './HomePage';

如果我删除括号,那么我收到此错误:

在'./HomePage'中找不到"导出'默认'(导入为'HomePage')

import HomePage from './HomePage';
<PrivateRoute exact path="/" component={HomePage} />

将此更改为首选默认导出的正确方法是什么？

Answer 1

从 eslint-plugin-import

当模块中只有一个导出时,更喜欢使用默认导出而不是命名导出.

class HomePage extends Component {
  //....
}

export default HomePage

在另一个文件中:

import HomePage from './Hello';

点击这里 codesandbox