如何在反应路由器中使用 HistoryLocation？答案

【问题标题】：How to use HistoryLocation in react router?如何在反应路由器中使用 HistoryLocation？
【发布时间】：2015-05-13 05:08:54
【问题描述】：

我正在尝试使用带有历史位置的路线，因为我不想在我的 url 中使用 #，我想使用普通的，我一直在尝试一切，每次我遇到相同的错误“无法获取 /loginpro ”。我不明白这些位置是如何工作的，这是我的代码

'use strict';
var React = require('react');
var Router = require('react-router'); // or var Router = ReactRouter; in browsers
var DefaultRoute = Router.DefaultRoute;
var Route = Router.Route;
var Cliente = require('./FormClientRegister');
var Login = require('./LoginProgresar');
var Contract = require('./FormContractRegister');

var routes =(<Route name="loginpro" path="/loginpro" handler={Login}/>);

Router.run(routes,Router.HistoryLocation,function (Handler) {
    React.render(<Handler />, document.getElementById('content'));
});

我正在使用带有 webpack、grunt js、karma、jshintrc、chrome 作为浏览器的 react js 0.13.3，我使用 yeoman 的 react js 生成器构建项目

我在 localhost 中运行我的应用程序，如下所示： http://localhost:8000/loginpro

【问题讨论】：

嗨，欢迎来到 Stack Overflow！为了让我们为您提供帮助，如果您能提供一些有关您的项目设置方式的详细信息，那就太好了。
我已经在问题中提供了更多细节！
您如何为您的应用提供服务？您是否实施了一条包罗万象的路线？
是的，我已经尝试过了，但没有成功，我正在使用 webpack 和 grunt 为应用程序提供服务。

标签： reactjs react-router

【解决方案1】：

如果您使用的是 webpack 开发服务器，则需要对其进行配置，以便为您的应用提供任何请求的 URL，而不仅仅是 /。

根据react-hot-loader troubleshooting docs，这应该只是将historyApiFallback: true 添加到开发服务器配置的情况。

This react-router issue 对此进行了更多讨论，包括人们使用的不同配置。

【讨论】：

我明白了，你是对的，现在它正在工作，非常感谢！ .对不起，我对 webpack 了解不多，这是我第一次使用它