React router 4 HashRouter，如何在url中隐藏哈希？

【问题标题】：React router 4 HashRouter, how do I hide hash in the url?React router 4 HashRouter，如何在url中隐藏哈希？
【发布时间】：2021-04-29 16:53:39
【问题描述】：

我正在使用 react-router-4 HashRouter，因为我将静态构建放入 AWS 存储桶并通过云端提供服务。所以基本上我在前端没有服务器来支持 BrowserRoute。

我想要的是：example.com/#/accounts_ to be _example.com/accounts
在 Angular 1.x 中，我会使用 $locationProvider.html5Mode(true) 来实现相同的效果。

任何帮助将不胜感激。

【问题讨论】：

改用{withRouter}

标签： reactjs react-router-v4

【解决方案1】：

您可以使用浏览器路由器。我建议阅读一下客户端和服务器路由的工作原理。

使用这种方法，如果您计划在生产环境中使用任何东西，则需要将该环境配置为具有指向索引页面的后备路由，然后处理客户端路由。

import { BrowserRouter, Switch, Route } from 'react-router-dom';

<BrowserRouter>
  <Switch>
    <Route exact path="/foo" component={FooController}
    <Route path="/foo/bar" component={FooController} />
  </Switch>
</BrowserRouter>

还有你的 webpack.config.js

devServer: {
  historyApiFallback: true,
},

【讨论】：