我正在爲教育目的編寫一個包含React的單頁應用程序。我的React-Router v4 BrowserRouter在CodeSandbox上正確處理客戶端路由,但本地不處理。在這種情況下,本地服務器是webstorm內置的devserver。 HashRouter在本地工作,但BrowserRouter不工作。Browserify + WebStorm調試在React-Router v4中斷了路由瀏覽器路由器
正常:https://codesandbox.io/s/j71nwp9469
我正在爲教育目的編寫一個包含React的單頁應用程序。我的React-Router v4 BrowserRouter在CodeSandbox上正確處理客戶端路由,但本地不處理。在這種情況下,本地服務器是webstorm內置的devserver。 HashRouter在本地工作,但BrowserRouter不工作。Browserify + WebStorm調試在React-Router v4中斷了路由瀏覽器路由器
正常:https://codesandbox.io/s/j71nwp9469
解決方案是瞭解push狀態路由和歷史API如何工作。在提供使用HTML5 History API的單頁應用程序時,需要通過索引頁面代理請求。
Webstorm dev服務器不包含此功能,因此在此線程中提及Webstorm是一個錯誤。
有多個庫可以爲我們做到這一點,或者它可以很容易地手工編碼。
你很可能在服務你的應用程序中內置的Web服務器(localhost:63342
),對不對?內部網站服務器在使用'絕對'網址(以斜槓開頭的)時返回,因爲它服務於localhost:port/project_name
而非localhost:port
的文件。這就是爲什麼您必須確保將所有網址從絕對網址更改爲相對網址。
無法將內部Web服務器設置爲使用項目根目錄作爲服務器文檔根目錄。但是您可以將其配置爲使用類似http://<host name>:<port>
的URL,其中'主機名稱'是在主機文件中指定的名稱,如127.0.0.1 myhostName
。見https://youtrack.jetbrains.com/issue/WEB-8988#comment=27-577559。