reactjs Route Not Found 请求的 URL

Question

我正在使用 Apache 2.2 来托管我的 reactjs 应用程序...在我的 App.js 中我有这段代码

import React, { Component } from 'react';
import './App.css';
import { BrowserRouter as Router,
        Route,
        Link,
        Switch,
        Redirect
 } from 'react-router-dom';
import Home from './components/Home';
import Cat from './components/Cat';

const NoMatch = ({ location }) => (
  <div>
        <h3>No match for <code>{location.pathname}</code> can be found.</h3>
  </div>
)

class App extends Component {
  render()
    return (
      <Router>
        <div>
          <Navbar />
        <Switch>
          <Route exact path="/" component={Home} />
          <Route exact path="/home" component={Home} />
          <Route exact path="/cat" component={Cat} />
          <Route component={NoMatch} />
        </Switch>
        </div>
      </Router>
    );
  }
}

export default App;

然后我使用 npm run build 并将我的构建文件夹中的所有内容移动到我的 DocumentRoot 文件夹 /var/www/html/home

在这个 /var/www/html/home 我也有一个 .htaccess 文件，我有

  RewriteEngine On
  RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
  RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d
  RewriteRule ^ - [L]
  RewriteRule ^ ./index.html

当我去 /Home 时它很好，当我点击刷新时它很好。但是然后我点击一个链接，它把我带到 /cat 并再次很好，但是当我刷新它时显示

未找到 在此服务器上未找到请求的 URL /cat。

有人遇到过这个问题吗？我在网上看到了很多关于解决问题的 .htaccess 文件，但它对我一点用都没有

Answer 1

我在服务器上遇到了同样的问题，运行 npm run build，创建一个包含已编译项目的文件夹，在 build 中创建 .htaccess 文件：

RewriteEngine On
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d
RewriteRule ^ - [L]
RewriteRule ^ ./index.html