Redux option outil de dev ne fonctionne pas sur Safari

Question

J'ai une application web avec front-end est écrit avec réagir et Redux et ceci est mon fichier index.jsx

import React, { Component } from 'react'; 
import ReactDOM from 'react-dom'; 
import { Router, Route, browserHistory, IndexRoute } from 'react-router'; 
import { Provider } from 'react-redux'; 
import thunk from 'redux-thunk'; 
import { createStore, applyMiddleware, compose } from 'redux'; 

import App from './app/App'; 
import Home from './app/Home'; 
import ContactMe from './app/ContactMe'; 
import ErrorPage from './app/ErrorPage'; 
import Post from './app/Post'; 
import makeRootReducer from './reducers/index'; 
require('./assets/stylesheets/bootstrap.scss'); 
require('./assets/stylesheets/styles.scss'); 

let store = null; 
const middleware = applyMiddleware(thunk); 

const enhancer = compose(
    middleware, 
    window.__REDUX_DEVTOOLS_EXTENSION__ && compose 
); 

store = createStore(
    makeRootReducer(), 
    {}, 
    enhancer 
); 

ReactDOM.render(
<Provider store={store}> 
    <Router history={browserHistory}> 
    <Route path="/" component={App} > 
     <IndexRoute component={Home} /> 
     <Route path="contact-me" component={ContactMe} /> 
     <Route path="post/:id" component={Post} /> 
     <Route path="*" component={ErrorPage} /> 
    </Route> 
    </Router> 
</Provider>, document.getElementById('root')); 

Actuellement cette application Web peut travailler sur le chrome mais pas sur Safari.

TypeError: undefined is not an object (evaluating 'b.apply') 

C'est l'erreur que je suis arrivé de safari. Et je trouve que si je supprime une ligne de code comme ci-dessous

window.__REDUX_DEVTOOLS_EXTENSION__ && compose 

fonctionne correctement à la fois sur le chrome et safari, mais je ne peux pas utiliser l'outil redux dev. Si je change & & en || (Comme ci-dessous et il fonctionne sur Safari, mais pas sur le chrome

window.__REDUX_DEVTOOLS_EXTENSION__ || compose 

Tout le monde peut comprendre ce qui ne va pas avec mon code. Parce que je dois utiliser l'outil de dev pour tracer l'état de l'application Web et l'exécuter sur le chrome et safari et

Answer 1

je courais dans le même problème pour un certain temps, mais je l'ignorer. le plus ennuyeux est que vous devez supprimer la fenêtre. REDUX_DEVTOOLS_EXTENSION du faisceau de production, sinon les utilisateurs sur Safari avoir une application qui pleure ...

Maintenant, j'ai décidé de finalement google un peu et voici ce que je trouve: https://medium.com/@zalmoxis/improve-your-development-workflow-with-redux-devtools-extension-f0379227ff83

Au lieu de window.devToolsExtension (qui a été prévu pour être dépréciée en faveur de la fenêtre. REDUX_DEVTOOLS_EXTENSION), maintenant nous allons utiliser la fenêtre. REDUX_DEVTOOLS_EXTENSION_COMPOSE:

Alors j'ai changé mon code de:

const createStoreWithFirebase = compose(
    reactReduxFirebase(fire, rrfConfig), // firebase instance as first argument 
    reduxFirestore(fire), 
    window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__() 
)(createStore) 

à:

const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose; 

    const createStoreWithFirebase = composeEnhancers(
    reactReduxFirebase(fire, rrfConfig), // firebase instance as first argument 
    reduxFirestore(fire) 
)(createStore) 

et maintenant il fonctionne.