How to use the react-router.useRouterHistory function in react-router

import React from 'react';
import ReactDOM from 'react-dom';
import ReactDOMServer from 'react-dom/server';
import { createHistory } from 'history';
import { Router, RouterContext, match, useRouterHistory, createMemoryHistory } from 'react-router';
import routes from './routes';
import Helmet from 'react-helmet';

// Client render (optional):
if (typeof document !== 'undefined') {
  const history = useRouterHistory(createHistory)({ basename: window.basename });
  const outlet = document.getElementById('app');
  ReactDOM.render( window.scrollTo(0, 0)} history={history} routes={routes} />, outlet)
}

// Exported static site renderer:
export default (locals, callback) => {
  const basename = locals.basename.substr(0, locals.basename.length - 1);
  match({ routes, location: locals.path, basename }, (error, redirectLocation, renderProps) => {
    var url;

    if (redirectLocation && redirectLocation.pathname) {
      url = redirectLocation.pathname;
      callback(null, `
      
      

document.addEventListener('DOMContentLoaded', () => {
  loadThirdParty();

  if (window.config.apiRoot) {
    // set up Redux store
    const parsedUrl = parseurl({ url: config.appRoot });
    const history = useRouterHistory(createHistory)({
      basename: parsedUrl.path
    });

    const store = configureStore({}, history);

    store.dispatch(tailerActions.sandboxSetApiRoot(config.apiRoot));
    if (config.generateAuthHeader) {
      store.dispatch(tailerActions.setAuthorizationHeader(Utils.getAuthTokenHeader()));
    }

    // set up user
    let userId;
    window.app = {};
    window.app.setupUser = () => store.dispatch(FetchUser.trigger());
    window.app.setupUser().then(() => {
      if (!store.getState().api.user.data.user) {

import ReactDOM from 'react-dom';
import AppRoutes from './AppRoutes';
import injectTapEventPlugin from 'react-tap-event-plugin';
import { browserHistory, useRouterHistory } from 'react-router';
import IsomorphicRelay from 'isomorphic-relay';
import IsomorphicRouter from 'isomorphic-relay-router';
import { createHashHistory } from 'history';

//Needed for React Developer Tools
window.React = React;

//Needed for onTouchTap
//Can go away when react 1.0 release
injectTapEventPlugin();

let history = useRouterHistory(createHashHistory)({queryKey: false});
// if (process.env.NODE_ENV === 'production') {
  history = browserHistory;
  IsomorphicRelay.injectPreparedData(JSON.parse(document.getElementById('preload').textContent));
// }

/**
 * Render the main app component. You can read more about the react-router here:
 */

ReactDOM.render(
   ready && done ? window.scrollTo(0, 0) : null}>
    {AppRoutes}
  ,
  document.getElementById('app')

import ExamplesAppRoot from './ExamplesAppRoot';
import ExamplesHomeScreen from './ExamplesHomeScreen';
import ExampleGroupScreen from './ExampleGroupScreen';
import ExampleScreen from './ExampleScreen';
import ApiServiceExampleScreen from './ApiService';
import NotFoundScreen from './decorators/router/NotFoundScreen';

// import AppLayoutExample from './components/AppLayout';

import { app, router } from 're-app/lib/decorators';
import { createStore, createReducer } from 're-app/lib/utils';
import routingModule from 're-app/lib/modules/routing';

// create hash history implementation to overcome gh-pages limitations
import createHashHistory from 'history/lib/createHashHistory';
const history = useRouterHistory(createHashHistory)();

const store = createStore({
	logging: false,
	modules: [
		routingModule,
	],
	reducers: {
		repository: createReducer({
			rootUrl: 'https://github.com/stackscz/re-app/tree/master/',
		}),
	},
	router: {
		history, // use hash history, for now, put it as param to @router decorator, too! See below.
	},
});

// @flow
import path from 'path'
import { useRouterHistory } from 'react-router'
import { createHistory } from 'history'
import pkg from '../../../package'

const browserHistory = useRouterHistory(createHistory)({
  basename: path.resolve(pkg['main-html'])
})

export default browserHistory

export default () => {
  return (
     window.scrollTo(0, 0)}
    >
      {routes}
    
  );
};

* https://www.mycompany.com/application/, then you need to do some extra steps when
   * configuring webpack and react-router so that you get the correct URLS for the
   * generated assets and so that actions like page refresh work like you expect.
   *
   * To make that process easier, this file has modified the default. The code below
   * generates identical behavior to 'browserHistory' except that it also allows you to
   * specify a 'basename' so that you can serve the application from a URL like /application/
   * instead of being restricted to the root domain.
   *
   * To coordinate the change with webpack, basename is provided as __BASENAME__, which
   * will be defined by webpack during build, and replaced with a real value. This will
   * be an empty string if the app will be served from the root domain, or something like
   * '/application' if the app will be served from /application/.
   */

  history: useRouterHistory(createHistory)({
    basename: __BASENAME__
  }),

  /**
   * Returns the routes used by the application.
   *
   * The 'lore.loader' object is a way of lazy-loading files and directories the framework
   * doesn't have control over such as the models, config directory, and in this case the
   * routes.js file at the root of the project.
   *
   * The reason the loader is used here is because the routes _must_ to be lazy-loaded,
   * since loading the routes will pull in the components, which may be using the
   * 'lore.connect' decorator that won't exist until the 'connect' hooks loads.
   *
   * Trying to load the routes directly in this config file will throw an error during
   * build, because lore loads the config file _before_ any of the hooks, since they

import { Provider } from 'react-redux';

import startReactApp from '../../platform/startup/react';
import createCommonStore from '../../platform/startup/store';
import startSitewideComponents from '../../platform/site-wide';

import routes from './routes.jsx';
import reducer from './reducers';
import manifest from './manifest.json';
import { updateRoute } from './actions';

const store = createCommonStore(reducer);

startSitewideComponents(store);

const history = useRouterHistory(createHistory)({
  basename: manifest.rootUrl
});

history.listen((location) => store.dispatch(updateRoute(location)));

startReactApp(
  
    
  
);

ReactRouter.match({ routes, location, basename }, () => {
  const router = (
    
  );
  ReactDOM.render(
    router,
    document.getElementById('react-content'),
  );
});

import 'assets/styles/app.scss';

const routes = {
  path: '/',
  component: App,
  indexRoute: {
    component: require('components/pages/Home')
  },
  childRoutes: [
    require('routes/Retina'),
    require('routes/Responsive')
  ]
};

const DEV = process && process.env && process.env.NODE_ENV === 'development';
const history = useRouterHistory(createHistory)({
  basename: '/' + (DEV ? '' : name)
});

const run = () => {
  ReactDOM.render(
    ,
    document.getElementById('app')
  );
};

if (window.addEventListener) {
  window.addEventListener('DOMContentLoaded', run);
} else {
  window.attachEvent('onload', run);
}