构建 react-app 后运行 serve -l ./build 后出现 404 错误

问题描述

当我尝试运行此命令时出现 404 错误

serve -l build

在构建了一个 React 应用程序之后，这是我的 ./app.js 和在文件中实现的 react-router。

import React from "react";
import Header from "./Components/Header";
import LeafletContainer from "./container/LeafletContainer";
import SignUp from "./Components/SignUp";
import Profile from "./Components/Profile";
import SavedLocations from "./Components/SavedLocations";
import Swiper from "./Components/swiper";

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

const Slash = () => {
  return (
    <>
      <Header />
      <LeafletContainer />
      <Swiper />
    </>
  );
};

function App() {
  return (
    <div className="wrapper">
      <Router>
        <Switch>
          <Route exact path="/" component={Slash} />
          <Route exact path="/signup" component={SignUp} />
          <Route exact path="/profile" component={Profile} />
          <Route exact path="/locations" component={SavedLocations} />
        </Switch>
      </Router>
    </div>
  );
}

export default App;

而且我在 ./package.json 中定义了这一行

{
...,"homepage": "."
...,}

解决方法

使用 -l 标志，您应该提供一个应该侦听的端点/端口。我想你应该在你的情况下使用 -s 标志：

serve -s build

或者您可以像这样将端口添加到您的命令中：

serve -l 3232 build

然后您可以在 localhost:3232

上找到您的应用