Question

这是我第一次使用React和React路由器，我遇到了一些深层链接问题。我已经构建了一个简单的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'));

Answer 1

您可以从根遍历网站，因为路由全部由/about/index.html处理，该网站从根网站的js文件加载。

gh-pages中没有html文件。 mysite.com/about托管静态网站，如果你在没有html文件的情况下转到{{1}}，它可能会给你一个404.

如果您使用的是网络包，请尝试使用https://github.com/markdalgleish/static-site-generator-webpack-plugin。

React Router深层链接

1 个答案: