如何配置 tomcat 7 以在 react 中使用 react-router-dom

Question

我在 react 中有一个项目，它在开发版本中运行良好，但是当我导出它(捆绑.js(并将其带到雄猫时，它无法识别 react-router-dom 的路由。

我需要在雄猫中配置一些东西吗？我找到了几个例子，但它们对我不起作用：

反应路由能够处理不同的 URL 路径，但 Tomcat 返回 404 不可用资源

https://github.com/gildata/RAIO/issues/138

这是我的索引.jsx：

import React from 'react';
import { render } from 'react-dom';
import { BrowserRouter } from 'react-router-dom';
import { IntlProvider } from 'react-intl';
import { Provider } from 'react-redux';
import store from 'src/app/store';
import App from 'src/app/App';
render(
  <Provider store={store}>
    <IntlProvider locale="en">
      <BrowserRouter>
        <App />
      </BrowserRouter>
    </IntlProvider>
  </Provider>,
  document.getElementById('contenedor'),
);

这是应用程序.jsx

import React from 'react';
import { Switch, Route, Redirect } from 'react-router-dom';
import Login from 'src/app/Login';
import Menu from 'src/app/Menu';
const logueado = localStorage.getItem('tLogueado');
const App = () => (
  <main>
    <Switch>
      <Route exact path="/login" render={() => (logueado ? (<Redirect to="/onix" />) : (<Login />))} />
      <Route exact path="/onix" render={() => (logueado ? (<Menu />) : (<Redirect to="/login" />))} />
    </Switch>
  </main>
);
export default App;

我做错了什么？ 请耐心等待，我是新反应的。

Answer 1

有两种

可能的方法可以解决这个问题

1. 使用 HashRouter 而不是 BrowserRouter

或

2. 使用基本名称，例如 ： <BrowserRouter basename="/calendar"/>

检查此链接 如何部署反应应用程序到子目录