未捕获的错误：需要一个字符串。您忘记了从定义的文件中导出组件，或者您可能混淆了默认/命名导入

Question

你能帮我解决这个问题吗？我已经尝试解决导入函数，但我仍然遇到该错误，并且我还尝试删除不起作用的“{}”。提前致谢。我正在学习 TylerMcginnis React-Redux 课程。导航.js

 import React from 'react'
import PropTypes  from 'prop-types'
import Link  from 'react-router-dom'
import { container, navContainer, link } from './styles.css'

Navigation.propTypes = ActionLinks.propTypes = NavLinks.propTypes = {
  isAuthed: PropTypes.bool.isRequired,
}

function NavLinks ({isAuthed}) {
  return (isAuthed === true
    ? <ul>
        <li><Link to='/' className={link}>{'Home'}</Link></li>
      </ul>
    : <noscript />)
}

function ActionLinks ({isAuthed}) {
  return (isAuthed === true
    ? <ul>
        <li>NEW DUCK</li>
        <li><Link to='/logout' className={link}>{'Logout'}</Link></li>
      </ul>
    : <ul>
        <li><Link to='/' className={link}>{'Home'}</Link></li>
        <li><Link to='/auth' className={link}>{'Authenticate'}</Link></li>
      </ul>)
}

export default function Navigation  ({isAuthed}) {
  return (
    <div className={container}>
      <nav className={navContainer}>
        <NavLinks isAuthed={isAuthed} />
        <ActionLinks isAuthed={isAuthed} />
      </nav>
    </div>
  )
}

---

主容器.js

 import React from 'react'
import  Navigation from '../../components/Navigation/Navigation'
import {container, innerContainer}  from './styles.css'
import createReactClass from 'create-react-class'

const MainContainer = createReactClass({
  render () {
    return (
      <div className={container}>
        <Navigation isAuthed={true} />
        <div className={innerContainer}>
          {this.props.children}
        </div>
      </div>
    )
  },
})

export default MainContainer

错误：未捕获错误：元素类型无效：需要一个字符串（对于内置组件）或一个类/函数（对于复合组件）但得到：未定义。您可能忘记从定义它的文件中导出您的组件，或者您可能混淆了默认导入和命名导入。在不变量（invariant.js:42）

原文由 Harsha 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

就我而言，我正在导入如下组件，所以我遇到了同样的错误。

 import { Calculator } from './src/calculator';

为了修复它，我修改了如下导入并且它起作用了。

 import Calculator from './src/calculator';

原文由 immirza 发布，翻译遵循 CC BY-SA 4.0 许可协议