React Router 深度链接

这是我第一次使用 React 和 React Router，我遇到了一些深层链接问题。我构建了一个简单的 SPA，在 React Router 的帮助下，我可以导航到 mysite.com/work、mysite.com/about 和 mysite.com/work/:projectid。如果我从网站的根目录（例如 mysite.com 并单击“工作”）开始，导航到这些页面没有问题。我遇到的问题是深层链接（手动输入 mysite.com/about 或刷新 mysite.com/about 上的页面）。这一切都在我的本地主机上运行，​​但在托管站点上不起作用（顺便说一句，该站点托管在 GitHub 页面上）。

这是因为我使用 GitHub 页面来托管我的网站吗？或者这是 React Router 的问题吗？

这是 main.js 的一部分：

var routes = (
    <Router history={history}>
        <Route path="/" component={App}>
            <IndexRoute component={Work} />
            <Route path="/work" component={Work} />
            <Route path="/work/:id" component={ProjectDetail} />
            <Route path="/about" component={About} />
        </Route>
        <Route path="*" component={NotFound} />
    </Router>
);

ReactDOM.render(routes, document.getElementById('main'));

您可以从根目录遍历该站点，因为路由全部由react-router它从根站点的 js 文件加载。

没有 html 文件位于/about/index.html. gh-pages托管静态站点，如果您访问mysite.com/about如果没有 html 文件，它可能会给你一个 404。

如果您正在使用 webpack，请尝试使用https://github.com/markdalgleish/static-site-generator-webpack-plugin https://github.com/markdalgleish/static-site-generator-webpack-plugin.