2016-07-22 5 views
0

Reactアプリケーションでホットリロードを実行しようとしていますが、このエラーをデバッグする方法がわかりません。モジュールを最新の状態に更新できませんでした

enter image description here

マイアプリケーションインデックスは次のようになります。

import React from 'react' 
import ReactDOM from 'react-dom' 
import Routes from 'routes/index' 
import { browserHistory } from 'react-router' 
import syncHistoryWithStore from 'modules/routing/sync' 

function createStore (browserHistory) { 
    let factory = require('./modules/store') 

    const store = factory.createStore(browserHistory) 

    if (module.hot) { 
    module.hot.accept('./modules/store',() => { 
     const nextFactory = require('./modules/store') 
     nextFactory.hydrateStore(store, factory.dehydrateStore(store)) 
     factory = nextFactory 
    }) 
    } 

    return store 
} 

const store = createStore(browserHistory) 
const history = syncHistoryWithStore(browserHistory, store, { 
    selectLocationState: state => state.routing, 
    adjustUrlOnReplay: true 
}) 

ReactDOM.render(
    <Routes history={history} store={store} />, 
    document.getElementById('root') 
) 

私が反応するコンポーネントのいずれかを変更しようとするとエラーが発生しました。これらのアップデートはroutes/indexパスを経由します。しかし、なぜ私がides、作品、鉱山を取ったreact-redux-universal-hot-exampleは、理解していないのですか?

私はホット例にのみ「減速」パスが hot.acceptので、私はかなりのリロードが任意の提案をコンポーネントが動作しますが、彼らはただやる...

反応してしまったか理解していないを持っていることがわかります

またはアイデアをどのようにデバッグする?

答えて

0

私が反応するホット・ローダーとそれを組み合わせる場合、それは動作します:

import { AppContainer } from 'react-hot-loader' 
import React from 'react' 
import ReactDOM from 'react-dom' 
import Routes from 'routes/index' 
import { browserHistory } from 'react-router' 
import syncHistoryWithStore from 'modules/routing/sync' 

function createStore (browserHistory) { 
    let factory = require('./modules/store') 

    const store = factory.createStore(browserHistory) 

    if (module.hot) { 
    module.hot.accept('./modules/store',() => { 
     const nextFactory = require('./modules/store') 
     nextFactory.hydrateStore(store, factory.dehydrateStore(store)) 
     factory = nextFactory 
    }) 
    } 

    return store 
} 

const store = createStore(browserHistory) 
const history = syncHistoryWithStore(browserHistory, store, { 
    selectLocationState: state => state.routing, 
    adjustUrlOnReplay: true 
}) 

ReactDOM.render(
    <AppContainer> 
    <Routes history={history} store={store} /> 
    </AppContainer>, 
    document.getElementById('root') 
) 

if (module.hot) { 
    module.hot.accept('./routes/index',() => { 
    // If you use Webpack 2 in ES modules mode, you can 
    // use <App /> here rather than require() a <NextApp />. 
    const NextRoutes = require('./routes/index').default 
    ReactDOM.render(
     <AppContainer> 
     <NextRoutes history={history} store={store} /> 
     </AppContainer>, 
     document.getElementById('root') 
    ) 
    }) 
} 

しかし、私はまだホットリロードの例では、働くことができる方法を理解していませんか?

関連する問題