2016-07-13 12 views
0

로컬 서버가 가동중인 경우 redux devTools를 에만 추가하고 싶습니다.입니다. 이것은 비동기 작업이므로 '불완전'저장소로 끝납니다.조건부 load redux devServer

서버가 있는지 확인하는 비동기 기능 :

export async function isReduxDevServerAlive(url,port, secure = false) { 
const server = secure ? 'https' : 'http' + `://${url}:${port}`; 
try { 
    let response = await fetch(server); 
    return true; 
} catch(error) { 
    return false; 
} 

스크립트는이 경우 알 때까지 내보낼 기다려야

import thunk from 'redux-thunk'; 
 
import devTools from 'remote-redux-devtools'; 
 
import { isReduxDevServerAlive } from './util/dev' 
 
import { createStore, applyMiddleware, combineReducers, compose } from 'redux'; 
 

 
import * as reducers from './reducers'; 
 
import * as constants from './constants'; 
 

 
let composable = [ applyMiddleware(thunk) ]; 
 
const reducer = combineReducers(reducers); 
 

 
if(isReduxDevServerAlive(constants.REDUX_DEV_SERVER, constants.REDUX_DEV_SERVER_PORT)) 
 
{ 
 
    composable.push(
 
     devTools({ 
 
      name: 'EPP app', realtime: true, 
 
      hostname: constants.REDUX_DEV_SERVER, port: constants.REDUX_DEV_SERVER_PORT, 
 
      maxAge: 30, filters: {blacklist: ['EFFECT_RESOLVED']} 
 
     }) 
 
    ); 
 
} 
 

 
const bconfigureStore = (c) => { 
 
     return createStore(reducer,{},compose(...c)); 
 
} 
 

 
export default function configureStore() { 
 
    return bconfigureStore(composable); 
 
}

store.js 스크립트 서버가 위 또는 아래입니다. 이 일을 수행하는 방법을 도와 주실 수 있습니까?

+0

서버가 가동 중인지 여부를 결정할 때까지 configureStore() 함수의 최종 실행을 보류하는 한 계속 작동해야합니다. 그 또 다른 것은 마음에 봄 - 어쩌면 redux dev 도구 크롬 도구 대신 dev 도구 패키지를 사용합니다. – WTK

답변

0

configureStore 함수를 비동기로 만들고 콜백에 렌더링을 적용해야합니다 (예 : here).

그러나 realtimefalse으로 설정하고 startOn 매개 변수 (명시 적으로 발송하거나 로컬 서버가 '가동'인 경우)에 지정된 모니터링을 시작할 수 있습니다. 이 경우 모니터링을 시작하기 위해 응용 프로그램을 다시 시작할 필요가 없습니다. 유일한 단점은 redux-devtools-instrument이 여전히 기록을 저장하므로 성능에 크게 영향을 미치지 않지만 주에 대형 개체가있는 경우 RAM을 소비 할 수 있다는 것입니다. 장비를 시작/중지 할 수있는 기능을 추가 할 수 있습니다.