尽管我认为我的代码是正确的，但主页未在应用程序中呈现。能指出错误的人对我很有帮助

Question

我正在尝试使用 React Router 渲染主页，但它不起作用。我已经被这个问题困住两天了。我们将非常感谢您的支持。我尝试了很多次来解决这个问题，但都无法解决。我使用chatgpt和其他工具来查看我的代码有什么问题，但一切都是徒劳的，没有令人满意的答案``` 在这里输入

import React from "react";

import "../styles/Home.css";

function HomePage() {
  return (
    <div className="home">
      <h1>hello world from here</h1>
    </div>
  );
}

export default HomePage;


import "./App.css";
import Navbar from "./components/Navbar";
import { BrowserRouter as Router, Routes, Route } from "react-router-dom";
import HomePage from "./pages/HomePage";

function App() {
  return (
    <Router>
      <div className="App">
        <Navbar />
        <Routes>
          <Route path="/" element={HomePage} />
        </Routes>
      </div>
    </Router>
  );
}

export default App;

Answer 1

您不能有多个默认导出。您默认导出应用程序和主页组件。 尝试默认仅导出应用程序，同时考虑到

Home

组件直接在同一文件上使用。