具体定义hashHistory但是---无法读取未定义的属性'getCurrentLocation'（...）

Question

我无法弄清楚为什么这个设置不起作用。我一直试图解决这个问题大约10个小时了。我使用history 3.2.1，react-router 3.0.2和react-router-redux 4.0.7，webpack 1.14.0

这个设置在开发中完全正常，但是一旦打包不起作用，因为看起来，hashHistory未定义。用于生产和开发的configureStore并没有太大的不同。

所有涉及的变量都是在devtools确认的执行时定义的。我认为问题在于加载我的routes.js或许（见下图）

任何人都能提供的任何帮助都会受到如此多的赞赏。谢谢你的阅读。

错误：

Cannot read property 'getCurrentLocation' of undefined(…)

configureStore.production.js

import { applyMiddleware, createStore, compose } from 'redux';
import { responsiveStoreEnhancer } from 'redux-responsive';
import thunk from 'redux-thunk';
import { routerMiddleware, push } from 'react-router-redux';
import rootReducer from '../reducers';
import storage from '../utils/storage';
import * as noteActions from '../actions/notes_actions';

var createHistory = require('history').createHashHistory;

const hashHistory = createHistory();


const actionCreators = {
  ...noteActions,
  push,
};


const router = routerMiddleware(hashHistory);

const enhancer = compose(
  responsiveStoreEnhancer,
  applyMiddleware(thunk, router),
  storage(),
);

export default function configureStore(initialState: Object | void) {
  return createStore(rootReducer, initialState, enhancer);
}

Index.js

import _ from 'lodash';
import React from 'react';
import { render } from 'react-dom';
import { Provider } from 'react-redux';
import storage from 'electron-json-storage';
import { syncHistoryWithStore } from 'react-router-redux';
import * as applicationUtils from './utils/functions';
import configureStore from './store/configureStore';
import myRoutes from './routes';
import './app.global.css';

var Router = require('react-router').Router;

var createHistory = require('history').createHashHistory;


let applicationState;
let stateKeyPresent;
let createStore;
let myHistory;
const hashHistory = createHistory();

function createStoreFunction() {
    createStore = configureStore(applicationState);
    myHistory = syncHistoryWithStore(hashHistory, createStore);
    render(
        <Provider store={createStore}>
        <Router history={myHistory} routes={myRoutes} />
        </Provider>,
        document.getElementById('root')
        );
}

storage.keys((err, keys) => {
    if (err) throw err;

    for (let i = 0; i < keys.length; i++) {
        if (keys[i] === 'state') {
            stateKeyPresent = keys[i];
        }
    };
});

let getStoredState = new Promise(function(resolve,reject) {
    storage.get('state', (err, data) => {
        if (!stateKeyPresent) {
            applicationState = {};
            resolve();
        } else if (data) {
            applicationState = JSON.parse(data);
            resolve();
        } else {
            applicationState = {};
            resolve();
        }
    });
});

getStoredState.then(() => {
    createStoreFunction()
});

Answer 1

尝试从包依赖项中卸载history npm模块。

React-router依赖项：

  "dependencies": {
    "history": "^3.0.0",
    "hoist-non-react-statics": "^1.2.0",
    "invariant": "^2.2.1",
    "loose-envify": "^1.2.0",
    "warning": "^3.0.0"
  },

React-router已经依赖它，并且history版本将随react-router安装一起安装。{/ p>

您不需要单独安装。

尝试

npm uninstall --save history react-router 

然后

install --save react-router@your_version

试。

检查它是否有效。