问"npm运行服务“构建后的空白页

EN

import React from "react";
import ReactDOM from "react-dom";
import { BrowserRouter } from "react-router-dom";
import reportWebVitals from "./reportWebVitals";
import { MoralisProvider } from "react-moralis";
import { App } from "./App";

const appID =
  process.env.REACT_APP_MORALIS_APP_ID;
const serverUrl =
  process.env.REACT_APP_MORALIS_SERVER_URL;

ReactDOM.render(
  <React.StrictMode>
    <MoralisProvider appId={appID} serverUrl={serverUrl}>
      <BrowserRouter>
        <App />
      </BrowserRouter>
    </MoralisProvider>
  </React.StrictMode>,
  document.getElementById("root")
);

reportWebVitals();

import Auth from "./components/header";
import Pannel from "./components/bottomNav";
import Profile from "./components/profile";
import Betting from "./components/betting";
import Raffle from "./components/raffle";

// import useMediaQuery from "@mui/material/useMediaQuery";
import { CssBaseline } from "@mui/material";
import { ThemeProvider, createTheme } from "@mui/material/styles";
import React, { useMemo, useState } from "react";
import { Routes, Route } from "react-router-dom";

const ColorModeContext = React.createContext({ toggleColorMode: () => {} });

function App() {
  // const prefersDarkMode = useMediaQuery("(prefers-color-scheme: dark)");
  // prefersDarkMode ? "dark" : "light"
  const [mode, setMode] = useState("dark");

  const theme = useMemo(
    () =>
      createTheme({
        palette: {
          mode,
          primary: {
            main: "#ffff00",
            dark: "#10294c",
          },
          secondary: {
            main: "#ffb400",
          },
        },
      }),
    [mode]
  );

  const colorMode = useMemo(
    () => ({
      toggleColorMode: () => {
        setMode((prevMode) => (prevMode === "light" ? "dark" : "light"));
      },
    }),
    []
  );

  return (
    <ColorModeContext.Provider value={colorMode}>
      <ThemeProvider theme={theme}>
        <CssBaseline />
        <Auth />
        <Routes>
          <Route path="/" element={<Profile />} />
          <Route path="bet" element={<Betting />} />
          <Route path="lottery" element={<Raffle />} />
        </Routes>
        <Pannel />
      </ThemeProvider>
    </ColorModeContext.Provider>
  );
}

export { App, ColorModeContext };