客户端控制台错误“ Uncaught SyntaxError：意外令牌'<'”

Question

我开发了reactjs应用，它可以正常工作，但是当我用F5键或刷新按钮刷新它时，它无法正常工作。我检查了客户端控制台，错误是这样的Uncaught SyntaxError: Unexpected token '<'
但是在服务器端控制台中，没有任何错误。我不知道为什么它会这样工作。 它只显示白页。

我将完整的代码上传到CodeSandbox。您可以在那里检查我所有的代码和问题。 问题仅在/ auth / login页面上

https://codesandbox.io/s/livetoday-9qgh8?fontsize=14

import React from "react";
import Avatar from "@material-ui/core/Avatar";
import Button from "@material-ui/core/Button";
import CssBaseline from "@material-ui/core/CssBaseline";
import TextField from "@material-ui/core/TextField";
import FormControlLabel from "@material-ui/core/FormControlLabel";
import Checkbox from "@material-ui/core/Checkbox";
import Link from "@material-ui/core/Link";
import Grid from "@material-ui/core/Grid";
import Box from "@material-ui/core/Box";
import LockOutlinedIcon from "@material-ui/icons/LockOutlined";
import Typography from "@material-ui/core/Typography";
import { makeStyles } from "@material-ui/core/styles";
import Container from "@material-ui/core/Container";
// import "typeface-roboto";
import {
  GoogleLoginButton,
  GithubLoginButton
} from "react-social-login-buttons";

function Copyright() {
  return (
    <Typography variant="body2" color="textSecondary" align="center">
      {"Copyright © "}
      <Link color="inherit" href="/">
        Live Today
      </Link>{" "}
      {new Date().getFullYear()}
      {"."}
    </Typography>
  );
}

const useStyles = makeStyles(theme => ({
  "@global": {
    body: {
      backgroundColor: theme.palette.common.white
    }
  },
  paper: {
    marginTop: theme.spacing(8),
    display: "flex",
    flexDirection: "column",
    alignItems: "center"
  },
  avatar: {
    margin: theme.spacing(1),
    backgroundColor: theme.palette.secondary.main
  },
  form: {
    width: "100%", // Fix IE 11 issue.
    marginTop: theme.spacing(1)
  },
  submit: {
    margin: theme.spacing(3, 0, 2)
  }
}));

export default function SignIn() {
  const classes = useStyles();

  return (
    <Container component="main" maxWidth="xs">
      <CssBaseline />
      <div className={classes.paper}>
        <Avatar className={classes.avatar}>
          <LockOutlinedIcon />
        </Avatar>
        <Typography component="h1" variant="h5">
          Sign in
        </Typography>
        <form className={classes.form} noValidate>
          <TextField
            variant="outlined"
            margin="normal"
            required
            fullWidth
            id="email"
            label="Currently local login is not supported"
            name="email"
            autoComplete="email"
            disabled
          />
          <Button
            type="submit"
            fullWidth
            variant="contained"
            color="primary"
            className={classes.submit}
            disabled
          >
            Sign In
          </Button>
        </form>

        <a
          href="/auth/google"
          style={{ color: "inherit", textDecoration: "none" }}
        >
          <GoogleLoginButton />
        </a>
        <a
          href="/auth/github"
          style={{ color: "inherit", textDecoration: "none" }}
        >
          <GithubLoginButton />
        </a>
      </div>
      <Box mt={8}>
        <Copyright />
      </Box>
    </Container>
  );
}