window .__ REDUX_DEVTOOLS_EXTENSION_COMPOSER__在Electron应用程序中未定义

时间:2019-08-12 23:24:18

标签: javascript redux react-redux electron redux-devtools-extension

试图在由Electron打包的Redux应用程序上使用redux-devtools-extension。

我正在使用电子版v5.0.7,电子版开发工具安装程序v2.2.4

如果我在Electron本地(在Electron内)启动Electron应用程序,并且查看devtools中的Redux部分,则会出现错误“找不到存储。请确保按照说明进行操作”。如果我通过本地主机访问该电子应用程序的Web版本,则可以看到redux-devtools正常工作。

这是我的main.js for Electron按照他们的documentation使用electron-devtools-installer安装扩展的方式:

app.on('ready', () => {
  createWindow();
  if (serve) {
    try {
      const { 
        default: installExtension,
        REDUX_DEVTOOLS
      } = require('electron-devtools-installer');

      installExtension(REDUX_DEVTOOLS)
        .then((name) => console.log(`Added Extension:  ${name}`))
        .catch((err) => console.log('An error occurred: ', err));
    } catch (e) {
      log.error('ERROR FROM ADDING DEVTOOLS: ', e);
    }
  }
});

电子窗口打开时,它会记录Added Extension: Redux DevTools

这是我根据其documentation将redux-devtools添加到我的商店中的方式:

import {
  createStore, combineReducers, applyMiddleware, compose,
} from 'redux';
import ReduxThunk from 'redux-thunk';
import { UserSettings, CurrentViewedAccount } from './ducks/index';

const composeEnhancers = typeof window === 'object' && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__
  ? window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({
    // Specify extension’s options like name, actionsBlacklist, actionsCreators, serialize...
  })
  : compose;

const enhancer = composeEnhancers(applyMiddleware(ReduxThunk));

const appReducer = combineReducers({
  UserSettings: UserSettings.default,
  CurrentViewedAccount: CurrentViewedAccount.default,
});

const rootReducer = (state, action) => {
  return appReducer(state, action);
};

const store = createStore(rootReducer, enhancer);

export default store;

当我尝试查看商店窗口中的内容时, REDUX_DEVTOOLS_EXTENSION_COMPOSE 未定义。

在Electron中运行该连接时似乎断开了连接,因为它作为普通的Web应用程序工作。我很好奇,是否有人能使它正常工作?

0 个答案:

没有答案