Svelte 路線給了我 404

Question

我在 Svelte 中為我的應用程序創建了一個簡單的路由器。 如果我從導航欄訪問鏈接，它就可以工作。 如果我重新加載頁面，它會給我 404.. 為什么？

<Router url="{url}">
 <nav>
   <Link to="/">Home</Link>
   <Link to="charts">About</Link>
 </nav>
 <div>
  <Route path="charts" component="{About}" />
  <Route path="/"><Home /></Route>
 </div>
</Router>

重新加載后：找不到此本地主機頁面未找到該網址的網頁： http://localhost:5000/charts

Answer 1

如上面的評論之一所述，如果使用匯總，則在調用npm run dev時，以下腳本組合將起作用

"scripts": {
    "build": "rollup -c",
    "dev": "rollup -c -w",
    "start": "sirv public --single"
  }

Answer 2

首先，我們將無法訪問您的鏈接，因為它是只能從本地計算機訪問的本地鏈接。

但是，我的賭注將是重定向問題。 您正在嘗試訪問服務器上的chart文件，該文件可能不存在，因為您的路由器應該執行該工作。

您需要配置服務器，以便將每條路由都重定向到索引文件，然后路由器將能夠通過分析URL來完成其工作。

Answer 3

您必須確保服務器為每個路由路徑都提供index.html ，而不僅僅是/ 。

如果您將sirv與Svelte入門項目之一一起使用，則可以在腳本中添加--single標志。

"scripts": {
  "start": "sirv public --single",
  "start:dev": "sirv public --dev --single"
},

Answer 4

這是為那些想要托管 svelte 應用程序的人准備的，如果您的托管服務提供商支持添加重定向或重寫規則，那么您可以這樣做來為路由器可以處理的任何請求提供index.html服務。

例如，Set source as /* /指路徑，通配符*指匹配任意請求路徑。

然后將您的目的地設置為只是/就是這樣。 不要將目的地設置為/index.html否則所有請求都會打開您的主頁，例如，如果您嘗試打開www.example.com/about那么它將打開www.example.com/index.html

並將操作設置為Rewrite而不是Redirect

並且這也解決了刷新站點和直接從瀏覽器打開URL的問題

Answer 5

改變
"start": "sirv public --no-clear"

對此“開始”：“sirv public -s --no-clear”

在你的 package.json 文件中，它對我有用