CODEWITHSUNDEEP
reactjsreact-router
David Eduardo Ortiz Velasco
David Eduardo Ortiz Velasco

Reputation: 104

How to use HistoryLocation in react router?

i am trying to use routes with history location because i dont want to use # inside my url's,i want to work with normal ones, i have been trying everything and every time i am getting the same error "Cannot GET /loginpro". i don't understand how the locations works, this is my code

'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'));
});

I am using react js 0.13.3 with webpack,grunt js,karma,jshintrc ,chrome as browser and i build the project with yeoman's react js generator

i am running my app in localhost like this: http://localhost:8000/loginpro

Upvotes: 4

Views: 1150

Answers (1)

Jonny Buchanan
Jonny Buchanan

Reputation: 62793

If you're using the webpack dev server, you need to configure it to serve up your app for any URL that's requested, not just for /.

According to the react-hot-loader troubleshooting docs, this should just be a case of adding historyApiFallback: true to the dev server config.

This react-router issue has more discussion around this, including different configurations people have used.

Upvotes: 4

Related Questions