Как исправить реакцию браузера на редукс? это становится пустой / белой страницей
У меня проблема с реакцией-редуксом и реактором-маршрутизатором. Все идет хорошо, ожидаю, когда я обновлю страницу, она станет белой или пустой. Я действительно новичок в реакции и роутере. Вот мои маршруты.js:
import React from "react";
import { Route, IndexRoute } from "react-router";
import Layout from "./components/Layout";
import userPage from "./components/user/User";
import rolePage from "./components/role/Role";
import addUserPage from "./components/user/AddUser";
import commandPage from "./components/command/Command";
import addCommandPage from "./components/command/AddCommand";
import editCommandPage from './components/command/EditCommand';
import groupPage from "./components/group/Group";
import executionPage from "./components/execution/Execution";
import loginPage from "./components/login/Login";
import dashboardPage from "./components/dashboard/Dashboard";
import addRolePage from "./components/role/AddRole";
import editRolePage from "./components/role/EditRole";
import addGroupPage from "./components/group/AddGroup"
import requireAuth from "./utils/requireAuth";
export default (
<Route path="/" component={Layout}>
<IndexRoute component={dashboardPage} />
<Route path="login" component={loginPage} />
<Route path="users" component={requireAuth(userPage)} />
<Route path="addUser" component={requireAuth(addUserPage)} />
<Route path="roles" component={requireAuth(rolePage)} />
<Route path="commands" component={requireAuth(commandPage)} />
<Route path="addCommand" component={requireAuth(addCommandPage)} />
<Route path="editCommand/:commandId" component={requireAuth(editCommandPage)} />
<Route path="groups" component={requireAuth(groupPage)} />
<Route path="addGroup" component={requireAuth(addGroupPage)} />
<Route path="execution" component={requireAuth(executionPage)} />
<Route path="addRole" component={requireAuth(addRolePage)} />
<Route path="editRole/:roleId" component={requireAuth(editRolePage)} />
</Route>
)
А также здесь мой App.js, где редуктор и магазины находятся здесь.
import React from 'react';
import ReactDOM from 'react-dom';
import { render } from 'react-dom';
import { Router, browserHistory } from 'react-router';
import { Provider } from 'react-redux';
import thunk from 'redux-thunk';
import { createStore, applyMiddleware, compose } from 'redux';
import rootReducer from './rootReducer';
import setAuthorizationToken from './utils/setAuthorizationToken';
import jwtDecode from 'jwt-decode';
import { setCurrentUser } from './actions/authActions';
import Select from 'react-select';
import Collapse, { Panel } from 'rc-collapse';
import Moment from 'react-moment';
import routes from './routes';
const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
export const store = createStore(rootReducer, composeEnhancers(
applyMiddleware(thunk)
));
if (localStorage.jwtToken) {
setAuthorizationToken(localStorage.jwtToken);
store.dispatch(setCurrentUser(jwtDecode(localStorage.jwtToken)));
}
const app = document.getElementById('app');
ReactDOM.render(
<Provider store={store}>
<Router history={browserHistory} routes={routes} />
</Provider>,
app);
Любые предложения и помощь высоко ценятся. Также я использую http-сервер https://www.npmjs.com/package/http-server для моего сервера разработки. Может быть, это является причиной проблемы. Мне нужно настроить мой сервер Dev