条件负载剩余devServer

Question

只有当本地服务器启动时，我才想将redux devTools添加到商店中。因为这是一个异步操作，所以我最终得到了一个“不完整”的存储。

检查服务器是否存在的异步函数：

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;
}

store.js脚本

​

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);
}

​

脚本应该等待导出，直到它知道服务器是打开还是关闭。你能帮我解决这件事吗？

Answer 1

您只需使您的configureStore函数异步，并在回调中应用呈现，例如，就像我们正在做的这里一样。

但是，您可以将realtime设置为false，并有一个为startOn参数指定的开始监视的操作(您显式地分派该参数，或者如果本地服务器处于“up”状态)。在这种情况下，您不必重新启动应用程序才能开始监视。唯一的缺点是redux-devtools-instrument仍将存储历史记录，它不会对性能产生显著影响，但如果状态中有大型对象，则会消耗内存。我们可以在那里增加启动/停止仪器的能力。