Reputation: 75
With localhost, it's normal. But when I use "npm run build" and upload the source to server live, My page is the blank screen which doesn't have any error, warning. This is my codes. Thanks for any help.
'use strict';
import React from 'react';
import { render } from 'react-dom';
import { Provider } from 'react-redux';
import { createStore , applyMiddleware } from 'redux';
import dataService from './box-message/api';
import switchsApp from './box-message/reducers';
import App from './box-message/components';
import {Router, Route, browserHistory} from 'react-router';
import MyProfile from './profile';
import '../index.html';
import '../libs/js/socketcluster.min.js';
import '../libs/css/styles.min.css';
window.store = createStore(switchsApp , applyMiddleware(dataService));
window.store.dispatch({type: 'GET_MESSAGE_DATA'});
render(
<Provider store={window.store} >
<Router history={browserHistory}>
<Route path="/" component={App} />
<Route path="/question" component={MyProfile} />
</Router>
</Provider>
,document.getElementById('root')
)
Upvotes: 3
Views: 2535
Reputation: 75
I found the way when run subfolder with react router.
import {Router, Route, browserHistory , hashHistory, IndexRoute , useRouterHistory } from 'react-router';
import { createHistory } from 'history'
const appHistory = useRouterHistory(createHistory)({
basename: "/demos/v1"
});
render(
<Provider store={window.store}>
<Router history={appHistory}>
<Route path="/" component={App}>
<IndexRoute component={BoxMessage} />
<Route path="/profile" component={MyProfile} >
<Route path="/profile/:id" component={MyProfile}/>
<Route path="/profile/:id/:fisrt_name" component={MyProfile}/>
<Route path="/profile/:id/:fisrt_name/:last_name" component={MyProfile}/>
<Route path="/profile/:id/:fisrt_name/:last_name/:avatar" component={MyProfile}/>
</Route>
</Route>
</Router>
</Provider>
,
document.getElementById('root')
)
Upvotes: 0
Reputation: 75
I edited something in my router. I use "browserHistory" to pretty url . It's working so well at localhost. I can swap router between index and profile page easily. But I meet again "blank screen" problem when upload server live (my domain is https).So i confuse with them . I need to helps . Thanks all!
. P/s : I use react-router : v3.0.2
import {Router, Route, browserHistory , hashHistory, IndexRoute} from 'react-router';
class App extends React.Component{
constructor(props) {
super(props);
}
render() {
return (
<section>
{this.props.children}
</section>
)
}
}
render(
<Provider store={window.store}>
<Router history={browserHistory}>
<Route path="/" component={App}>
<IndexRoute component={BoxMessage} />
<Route path="/profile" component={MyProfile} />
</Route>
</Router>
</Provider>
,
document.getElementById('root')
)
Upvotes: 0