Javascript 元素类型无效| React

我使用WebStorm作为我的环境。每次尝试在浏览器上运行应用程序时，我都会遇到此错误：

错误：元素类型无效：需要字符串（对于内置组件）或类/函数（对于复合组件），但得到：对象。您可能忘记了从定义组件的文件中导出组件，或者您可能混淆了默认导入和命名导入

下面是我的代码

import React from 'react';
import './App.css';
import Navbar from './components/Navbar';
import { BrowserRouter as Router, Switch, Route } from 'react-router-dom';
import Dashboard from './pages/dashboard';
import Deliveries from './pages/deliveries';
import Promotions from './pages/promotions';
import Inventory from './pages/inventory';
import BusinessHours from './pages/business_hours';
import BankAccount from './pages/bank_account';
import Payments from './pages/payments';
import Employees from './pages/employees';
import RequestDelivery from './pages/request_delivery';
import Support from './pages/support';

function App() {
    return (
        <>
            <Router>
                <Navbar />
                <Switch>
                    <Route path='/' exact component={Dashboard} />
                    <Route path='/deliveries' component={Deliveries} />
                    <Route path='/promotions' component={Promotions} />
                    <Route path='/inventory' component={Inventory} />
                    <Route path='/businesshours' component={BusinessHours} />
                    <Route path='/bankaccount' component={BankAccount} />
                    <Route path='/payments' component={Payments} />
                    <Route path='/employees' component={Employees} />
                    <Route path='/requestdelivery' component={RequestDelivery} />
                    <Route path='/support' component={Support} />
                </Switch>
            </Router>
        </>
    );
}

export default App;

从“React”导入React；
导入“/App.css”；
从“./components/Navbar”导入Navbar；
从“react Router dom”导入{BrowserRouter as Router，Switch，Route}；
从“./pages/Dashboard”导入仪表板；
从“./pages/Deliveries”导入交货；
从“/页面/促销”导入促销；
从“./页面/库存”导入库存；
从“./pages/business_hours”导入营业时间；
从“./pages/bank_account”导入银行帐户；
从“./pages/Payments”导入付款；
从“./pages/Employees”导入员工；
从“./pages/request_delivery”导入RequestDelivery；
从“/pages/Support”导入支持；
函数App（）{
返回(
);
}
导出默认应用程序；

---

检查如何导出每个组件。我的猜测是，您没有将所有组件作为默认值导出，这意味着您必须将导入的组件用花括号括起来。

---

另一个选项是，您可能忘记将导出添加到组件。

在错误消息中指向哪一行：<代码>路由器的渲染方法。消费者< /代码>。警告（34∶5）开始值有混合支持，考虑使用Flex启动代替。/SRC/组件/NavBAR.CSS。（./NoDeDeMeflase/CdSult/DIST/CJS.JS？RoF？5-ON-4-1？./NoDeDead模块/ PASCSS加载器/SRC？？PASCSS！/SRC/组件/ NavBar？CSS）警告（5:5）启动值有混合支持，考虑使用Flex启动代替。/SRC/组件/NavBAR.CSS。（./node_modules/css loader/dist/cjs.js？？ref--5-oneOf-4-1！。/node_modules/postss loader/src？？postss！。/src/components/Navbar.css）警告首先共享问题本身中的错误消息，而不是注释。其次，共享Navbar.css代码。警告目前与此无关，让我们先处理错误（所以我们暂时不要谈论

Navbar.css

）。是否每个组件文件都使用

export default

导出类/函数组件？