Javascript 根id中没有呈现任何内容

我的页面上没有呈现任何内容，我很困惑。我想知道是否有人能帮我做这件事

App.js：

import React from "react";
import Header from "../layout/Header/Header";
import Footer from "../layout/Footer/Footer.jsx";

import {
  BrowserRouter as Router,
  Route,
  Switch,
  Redirect
} from "react-router-dom";

import NotFound from "./NotFound";

import Home from "../pages/Home";
import Pricing from "../pages/Pricing";
import Contact from "../pages/Contact";
import About from "../pages/About";
import Dashboard from "../pages/Dashboard";
import Signin from "../pages/Signin";


class App extends React.component {
  render() {
    return (
      <>
        <div className="App">
          <Header />
          <Router>
            <App />
            <Switch>
              <Route exact path="/home" component={Home} />
              <Route exact path="/about" component={About} />
              <Route exact path="/contact" component={Contact} />
              <Route exact path="/pricing" component={Pricing} />
              <Route exact path="/dashboard" component={Dashboard} />
              <Route exact path="/signin" component={Signin} />
              <Route component={NotFound} />
              <Redirect from="/" to="home" />
            </Switch>
          </Router>
        </div>
        <Footer />
      </>
    );
  }
}

export default App;

从“React”导入React；
从“./layout/Header/Header”导入页眉；
从“./layout/Footer/Footer.jsx”导入页脚；
进口{
BrowserRouter作为路由器，
路线,，
转换
重新使用
}从“反应路由器dom”；
从“/NotFound”导入NotFound；
从“./页面/主页”导入主页；
从“./页/定价”导入定价；
从“./页面/联系人”导入联系人；
从“./pages/About”导入关于；
从“./页面/仪表板”导入仪表板；
从“./页/登录”导入登录；
类App扩展了React.component{
render（）{
返回(
);
}
}
导出默认应用程序；

下面是我的index.js：

import React from "react";
import { render } from "react-dom";

import App from "./components/App/App";

//import Signup from "components/pages/SignupBRUH";
import "./styles/styles.scss";

render(<App />, document.getElementById("root"));

从“React”导入React；
从“react dom”导入{render}；
从“/components/App/App”导入应用程序；
//从“组件/页面/SignupBRUH”导入注册；
导入“/styles/styles.scss”；
render（，document.getElementById（“根”））；

我的项目也使用passport，如果这有什么帮助的话。这可能是路由或其他方面的错误。我不知道

---

如果有人能帮我解决这个问题，那就太棒了，谢谢。

你能试着渲染下面的应用程序组件，以确保模板连接正确吗

class App extends React.component {
  render() {
    return (
      <>
        <div>
            App Component
          </div>
      </>
    );
  }
}

类应用程序扩展React.component{
render（）{
返回(
应用程序组件
);
}
}

您的控制台中有任何错误吗？除了：GET/home 304 4.245 ms--GET/js/app.js 200 4.564 ms--每当我重新加载页面时，它是您的HTML静态页面还是由插件生成的？如果是这样，您是否已使用

id=“root”

检查元素是否存在，并且您正在导入应用程序脚本？是的，它的id为root：我正在使用webpack，idk，如果有帮助的话