我如何重写我的 firebase.json 文件，以便我可以看到我的所有页面

Question

我刚刚使用 react.js 创建了我的第一个网站。 当我运行它时，一切正常，我可以看到所有页面 （所以到目前为止，路由器都工作正常）。

我想用 firebase 托管我的网站，一切正常，我有一个域，我可以从我的网站访问登录页面。 网址：tracker-2baa0.web.app 但是当我想更改页面时，例如我想通过单击左上角的房子符号更改为“/菜单”，我收到错误消息“404 Page Not Found”。

我从其他人那里读到我必须重写 firebase.json 文件，但我不知道那里的东西到底是什么意思。 特别是我需要如何为各个路由器编写重写。

这是我的 firebase.json 文件：

    {
  "firestore": {
    "rules": "firestore.rules",
    "indexes": "firestore.indexes.json"
  },
  "hosting": {
    "public": "build",
    "rewrites": [ {
      "source": "/Menu/*",
      "destination": "/Menu"
    }],  
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ]
  },
  "storage": {
    "rules": "storage.rules"
  }
}

还有我的路线：

var App = () => {
  var currentUserName = ""

  return (
   
    <AuthProvider>

   <Router>
   <Switch>
  
     <Route path ='/menu' exact component={Menu} />
     <Route path ='/add' exact component={Add} />
     <Route path = '/add-Evaluation' component ={AddEvaluation}/>
     <Route path ='/login' exact component={Login} />
     <Route exact path="/signup" component = {SignUp} />
     <Route path ="/projekt" exact component={Projekt} />
     <Route path ="/Contact" exact component={Contact} />
     <PrivateRoute exact path="/" component = {Home} />

  
   </Switch>
   </Router>

    </AuthProvider>
  );
}

我没有托管经验，如果有人可以帮助我或给我一些建议，我会非常高兴。

爱的问候

Answer 1

如果您的应用是“Progressive Web App”或PWA，您很可能希望重写所有指向索引的路径。 这通常通过以下重写来完成：

    "rewrites": [
      {
        "source": "**",
        "destination": "/index.html"
      }
    ]

这是因为像 react 这样的现代框架不会更改页面，而是根据 URL 路径使用页面内容编辑主页index.html。

您也可以对云功能和其他很酷的东西进行其他重写，并且可以在文档中查看 Firebase 托管支持的许多功能here 的完整示例。

清除缓存以确保您看到服务器端的更改也是重要的