错误：文件夹不包含名为 'Navbar1' 的导出

Question

我一直得到错误，我很确定不应该在那里。

这是我一直得到的错误:/src/App.js21:24-31"。/components/Navbar/Navbar'不包含名为'Navbar1'的导出。

然而，这是我的代码导航栏:

import React, { Component } from 'react'
import './Navbar.css'
import 'bootstrap/dist/css/bootstrap.min.css';
import { Container, Navbar, NavbarBrand, Nav, Button, Accordion } from 'react-bootstrap'

class Navbar1 extends Component {


render() {
return(
<Navbar bg='light' variant='light'>
<Container >
<NavbarBrand className='brandcolor'>
<h1>ETHER<span>SHARE<i className="fab fa-ethereum"></i></span></h1>
</NavbarBrand>
</Container>

<Container >
<Nav >
<ul>
<Nav.Link className='linkitem'>
<li>
<Accordion>
<Accordion.Item eventKey="0">
<Accordion.Header className='linkitem'>Account</Accordion.Header>
<Accordion.Body className='linkitem'>Settings</Accordion.Body>
<Accordion.Body className='linkitem'>Taxes</Accordion.Body>
</Accordion.Item>
</Accordion>
</li>
</Nav.Link>
<Nav.Link className='linkitem'><li>Stats</li></Nav.Link>
<Nav.Link className='linkitem'><li>Pool</li></Nav.Link>
</ul>
</Nav>
</Container>
<Container > 
<Button variant="light">Connect Wallet</Button>
</Container>
</Navbar>
)
}
} 
export default Navbar1;

这是我在app .js中的代码，我的应用程序在一小时前工作得很好，我想知道问题是什么:

import React from 'react';
import './App.css';
import { Navbar1 } from './components/Navbar/Navbar';
import { Footer } from './components/Footer/Footer';
import { library } from '@fortawesome/fontawesome-svg-core';
import { fab } from '@fortawesome/free-brands-svg-icons';
import { faCheckSquare, faCoffee } from '@fortawesome/free-solid-svg-icons';

library.add(fab, faCheckSquare, faCoffee)
function App() {
return (
<div className="App">

<Navbar1 />

<Footer />

</div>

);
}
export default App;

Answer 1

默认导出

这样做

import Navbar1 from './components/Navbar/Navbar'

不是这个

import {Navbar1} from './components/Navbar/Navbar'

Answer 2

如果您使用的是export default，您应该导入它为(不带花括号):

import Navbar1 from './components/Navbar/Navbar'

为了像在App.js中那样导入它，你应该把它导出为一个命名的export:

export { Navbar1 }