Configure a redux store with redux devtools (the chrome extension)
<p>I am using the following boilerplate example and I'm trying to configure it to work with the chrome extension for redux devtools:</p>

<pre><code>import { createStore, applyMiddleware } from 'redux'
import thunkMiddleware from 'redux-thunk'
import apiMiddleware from '../middleware/api'
import createLogger from 'redux-logger'
import rootReducer from '../reducers'


const logger = createLogger({
  level: 'info',
  collapsed: false,
  logger: console,
  predicate: (getState, action) =&gt; true
})

const createStoreWithMiddleware = applyMiddleware(
  thunkMiddleware,
  apiMiddleware,
  logger
)(createStore)

export default function configureStore(initialState) {
  const store = createStoreWithMiddleware(rootReducer, initialState)

  if (module.hot) {
    // Enable Webpack hot module replacement for reducers
    module.hot.accept('../reducers', () =&gt; {
      const nextRootReducer = require('../reducers')
      store.replaceReducer(nextRootReducer)
    })
  }

  return store
</code></pre>

<p>}</p>

<p>I've tried adding it as follows, but I'm getting a window not defined error:</p>

<pre><code>import { compose, createStore, applyMiddleware } from 'redux'

const createStoreWithMiddleware = compose(applyMiddleware(
  thunkMiddleware,
  apiMiddleware,
  logger
),window.devToolsExtension ? window.devToolsExtension() : f =&gt; f)(createStore)
</code></pre>

<p>I'm assuming the structure is somehow different, than the one given in the reudx-devtools extension example pages, but I can't put my finger on it.</p>

<p>How do I setup the store with middlewares and enhancements the right way? </p>