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函数异步并在回调中应用渲染，例如，正如我们正在进行here。

但是，您可以将realtime设置为false并启动监控操作，为startOn参数指定（明确发送或本地服务器为'up'）。在这种情况下，您不必重新启动应用程序即可开始监控。唯一的缺点是redux-devtools-instrument仍将存储历史记录，它不会显着影响性能，但如果状态中有大型对象，则可以使用RAM。我们可以添加启动/停止仪器的功能。

有条件的load redux devServer

1 个答案: