Redux-devtools-extension: No store found

[Sbphillips19]

I haven't used redux devtools for a couple weeks, but it was working before. Now I am just getting an error that says I need to follow the instructions as there is no store. Here is my setup.

import { createStore, applyMiddleware } from 'redux';
import { composeWithDevTools } from 'redux-devtools-extension';
import thunk from 'redux-thunk';

import reducer from './reducer';

const configureStore = () => {
  const middleware = [thunk];
  return createStore(
    reducer,
    composeWithDevTools(applyMiddleware(...middleware))
  );
};

export { configureStore };

[PierrickGT]

I'm having the same problem on Chrome, it was working last week but stopped working yesterday. Maybe the problem is due to an update from Chrome.

[Sbphillips19]

@PierrickGT I didn't have an updated version of chrome. I updated after your comment and am still facing the same issue.

[codeepic]

Me and my coworker have the same issue now as well.

[rmammina]

I had this issue as well. I updated npm package as I had an outdated version of redux-devtools, uninstalled the extension from chrome, and re-installed the extension and it worked.

[CalMlynarczyk]

We started noticing this recently as well in Firefox and Chrome (same with the React Devtools). I was able to trace it back to some changes we made to our Content-Security-Policy header in our application. If you use CSP, you need to have script-src 'unsafe-inline' in the header value in order for this extension to work correctly.

[Sbphillips19]

I have updated package and re-installed the extension but still the same error. Have probably tried 5 times in the last 2 months. It's pretty hard to debug redux without the dev tools. Also I don't have a CSP so can't try anything with that.

[Sbphillips19]

I am closing this. I decided to just go with this set up instead as it is now working:

import { compose, createStore, applyMiddleware } from 'redux';
import thunk from 'redux-thunk';

import reducers from '../reducers';

const middleware = [thunk];
// eslint-disable-next-line no-underscore-dangle
const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;

export default createStore(reducers, composeEnhancers(applyMiddleware(...middleware)));

I could never get it set up with:

import { composeWithDevTools } from 'redux-devtools-extension';

[xdlgj]

I am closing this. I decided to just go with this set up instead as it is now working:

import { compose, createStore, applyMiddleware } from 'redux';
import thunk from 'redux-thunk';

import reducers from '../reducers';

const middleware = [thunk];
// eslint-disable-next-line no-underscore-dangle
const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;

export default createStore(reducers, composeEnhancers(applyMiddleware(...middleware)));

I could never get it set up with:

import { composeWithDevTools } from 'redux-devtools-extension';

I use “const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose” but it still do not work