Redux Dev Tools No store found 문제 해결 방법

생활코딩 Redux 강좌를 진행하면서 Redux Dev Tools를 설치하고 이를 활용하는 방법에 대해서 학습하고 있었는데 저의 경우에는 아무리 재시작을 해보아도 아래와 같은 오류가 지속적으로 발생하였습니다.

Redux의 Basic Store 문서 항목을 살펴보면 아래와 같은 코드로 사용이 가능하다고 되어있습니다.

 const store = createStore(
   reducer, /* preloadedState, */
   window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
 );

 

 

제대로 작성한 것 같은데 작동이 되지 않고 콘솔 자체에서 문제가 발생하는 것도 아니니 답답해서 검색을 조금 하여보니 Redux Dev Tools은 탐색기로 직접 HTML 파일을 실행한 상태에서는 작동되지 않고 웹서버 위에서만 작동이 된다고 합니다.

 

웹서버를 올리는 방법으로는 여러 가지 방법이 있겠지만 저는 최소한의 환경을 원했으므로 크롬 웹스토어에서 Web Server for Chrome이라는 웹앱을 설치하여 사용하였습니다.

 

https://chrome.google.com/webstore/detail/web-server-for-chrome/ofhbbkphhbklhfoeikjpcbhemlocgigb?utm_source=chrome-app-launcher-info-dialog

Web Server for Chrome

위와 같이 HTML 파일이 있는 폴더를 지정해주고 서버를 작동시키면 localhost환경에서 HTML이 실행됩니다. 이후에 Redux Dev Tools를 작동시키면 제대로 작동됨을 확인하실 수 있습니다.