類型錯誤：無法讀取上反應Chrome擴展

我正在開發使用React-Chrome-Redux library 類型錯誤：無法讀取上反應Chrome擴展

這是我第一次開發使用這一個陣營Chrome擴展和我被困在一個錯誤財產「錯誤」的不確定，我可以」弄清楚原因。

我彈出應用程序是在運行時沒有與控制檯上出現以下錯誤信息：

Error in event handler for (unknown): TypeError: Cannot read property 'error' of undefined

我試圖調試，並在錯誤的確切位置設置斷點：

return new Promise(function (resolve, reject) { 
    chrome.runtime.sendMessage({ 
     type: _constants.DISPATCH_TYPE, 
     payload: data 
    }, function (_ref2) { 
     var error = _ref2.error; 
     var value = _ref2.value; 

     if (error) { 
     reject((0, _assignIn2.default)(new Error(), error)); 
     } else { 
     resolve(value.payload); 
     } 
    }); 
    }); 
}

在Promise回調中，_ref2在動作爲：類型：「chromex.dispatch」時未定義，且有效負載也未定義。

這開始發生介紹調度方法來啓動認證過程之後，代碼如下：

class App extends Component { 

    constructor(props) { 
    super(props); 

    this.props.dispatch({ 
     type: START_AUTH 
    }); 
    }

在兩個彈出/ index.js和背景/ index.js我設置的商店溝通渠道：

//popup 
import {Store} from 'react-chrome-redux'; 
import {Provider} from 'react-redux'; 


const proxyStore = new Store({ 
    portName: 'my_app' 
}); 

//background 
import rootReducer from '../core/reducers'; 

import {wrapStore} from 'react-chrome-redux'; 
import {render} from 'react-dom'; 
import {Provider} from 'react-redux'; 
import {Store} from 'react-chrome-redux'; 

import App from './components/App'; 

const store = createStore(rootReducer, {}); 

wrapStore(store, { 
    portName: 'my_app' 
});

我有大量的身份驗證過程日誌消息，但似乎沒有發生。

在覈心/我有通用文件，如減速器，動作類型，動作等，它總是由webpack-babel從ES6轉換而來。

不幸的是，似乎React開發工具不適用於Chrome擴展程序以幫助調試。

任何想法或任何更多的信息，你需要幫助我弄清楚發生了什麼以及如何解決它？

來源

2016-12-29 danielfranca

該解決方案比我預期的要簡單得多。

的動作名稱並沒有被出口，所以分派類型竟是undefined

下更改：

const START_AUTH = "START_AUTH";

到：

export const START_AUTH = "START_AUTH";

解決的問題。

來源

2016-12-29 16:39:26 danielfranca

這是給任何人在這裏尋找答案的絆腳石。 @danielfranca發佈的內容僅僅是症狀。

實際發生的情況是，在調度操作後會出現一個錯誤（在後臺頁面中），所以操作無法完成。請參閱wrapStore.js或更低版本（如果他們的github有變化）。

chrome.runtime.onMessage.addListener((request, sender, sendResponse) => { 
    if (request.type === DISPATCH_TYPE) { 
    const action = Object.assign({}, request.payload, { 
     _sender: sender 
    }); 

    dispatchResponder(store.dispatch(action), sendResponse); 
    return true; 
    } 
});

下面這一行，store.dispatch(action)會返回結果。但是如果在這個過程中發生錯誤（在reducer中），那麼你不會得到結果。

dispatchResponder(store.dispatch(action), sendResponse);

因此，它什麼都沒發回（undefined）（refer to here）。並且在Store.js中，dispatch函數嘗試從undefined檢索error密鑰，從而導致該錯誤。

因爲您正在檢查彈出窗口/內容頁面，您會收到此非常模糊的錯誤消息。如果你檢查你的背景頁面，你會看到實際的錯誤。

我創建了一個PR用於顯示更有用的錯誤消息。希望它會合並。

來源

2017-01-21 04:58:56

廣泛的問題的很好的答案。這有助於我在後臺頁面找到我的語法錯誤，這是由於我的.babelrc文件的配置不正確。 –

類型錯誤：無法讀取上反應Chrome擴展

回答

相關問題