Не работает redux devtools

Redux-devtools перестал работать #804

Comments

KirillWeb2 commented Jun 15, 2021 •

Писал проект, смотрел в redux devtools данные, которые приходят с сервера, всё было хорошо и до этого пользовался месяц или два, но сегодня он просто перестал работать магическим образом, переустанавливал его через npm, переустанавливал в браузере, не помогает. Что мне делать?

Может этот скриншот что-то даст

The text was updated successfully, but these errors were encountered:

NProtsenko commented Aug 13, 2021 •

Попробуй написать на английском)

You can’t perform that action at this time.

You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.

Источник

NgRx Redux devtools not showing store and state details even though applicaton is working fine

I am using the below sample application to learn angular+ngrx. APM Sample NgRx App

I have installed Redux firefox extension. But whenever I run/reload application, redux tab shows ‘No store found’ message. The application is working as expected(is able to retain state). I am able to dispatch actions, handle it in the reducer etc.. Please help.. I am stuck in this for quite a long time.

5 Answers 5

There is an issue with Angular app when Redux doesn’t see your Store

Check that you have

after

Otherwise you are in trouble.

BTW, it is better to install DevTools with

It adds schematics to the project.

To use the Redux devtools you’ll have to install @ngrx/store-devtools and import it in the AppModule — docs.

Install it with:

If you have @ngrx/store-devtools installed and the store still doesn’t show up (instead, you see No store found — blah blah blah instructions), context menu over the frame and select Reload Frame.

One of the tickets claimed that this workaround should no longer be necessary, but to me it was (Angular and store around v.7.2.x, Redux DevTools extension 2.17)

Источник

Не работает redux devtools

Redux DevTools Extension

• from Chrome Web Store;
• or download extension.zip from last releases, unzip, open chrome://extensions url and turn on developer mode from top left and then click; on Load Unpacked and select the extracted folder for use
• or build it with npm i && npm run build:extension and load the extension’s folder ./build/extension ;
• or run it in dev mode with npm i && npm start and load the extension’s folder ./dev .

• from Mozilla Add-ons;
• or build it with npm i && npm run build:firefox and load the extension’s folder ./build/firefox (just select a file from inside the dir).

• just specify REDUX_DEVTOOLS in electron-devtools-installer .

4. For other browsers and non-browser environment

Note that starting from v2.7, window.devToolsExtension was renamed to window.__REDUX_DEVTOOLS_EXTENSION__ / window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ .

For a basic Redux store simply add:

Note that preloadedState argument is optional in Redux’s createStore .

For universal («isomorphic») apps, prefix it with typeof window !== ‘undefined’ && .

For TypeScript use redux-devtools-extension npm package, which contains all the definitions, or just use (window as any) (see Recipes for an example).

In case ESLint is configured to not allow using the underscore dangle, wrap it like so:

Note: Passing enhancer as last argument requires redux@>=3.1.0. For older versions apply it like here or here. Don’t mix the old Redux API with the new one.

You don’t need to npm install redux-devtools when using the extension (that’s a different lib).

1.2 Advanced store setup

If you setup your store with middleware and enhancers, change:

Note that when the extension is not installed, we’re using Redux compose here.

To specify extension’s options, use it like so:

1.3 Use redux-devtools-extension package from npm

To make things easier, there’s an npm package to install:

and to use like so:

In case you don’t include other enhancers and middlewares, just use devToolsEnhancer :

1.4 Using in production

It’s useful to include the extension in production as well. Usually you can use it for development.

If you want to restrict it there, use redux-devtools-extension/logOnlyInProduction :

or with middlewares and enhancers:

You’ll have to add ‘process.env.NODE_ENV’: JSON.stringify(‘production’) in your Webpack config for the production bundle (to envify). If you use create-react-app , it already does it for you.

If you’re already checking process.env.NODE_ENV when creating the store, include redux-devtools-extension/logOnly for production environment.

If you don’t want to allow the extension in production, just use redux-devtools-extension/developmentOnly .

1.5 For React Native, hybrid, desktop and server side Redux apps

For React Native we can use react-native-debugger , which already included the same API with Redux DevTools Extension.

For most platforms, include Remote Redux DevTools ‘s store enhancer, and from the extension’s context menu choose ‘Open Remote DevTools’ for remote monitoring.

2. Without Redux

See integrations and the blog post for more details on how to use the extension with any architecture.

Live demos to use the extension with:

Support us with a monthly donation and help us continue our activities. [Become a backer]

Become a sponsor and get your logo on our README on Github with a link to your site. [Become a sponsor]

If you like this, follow @mdiordiev on twitter.

Источник

Redux приложение не работает, если расширение Redux DevTools не установлено

Хранилище настраивается следующим образом:

Однако мое приложение React (загруженное с помощью CRA) не будет работать, если у меня не установлено расширение Redux Devtools.

Может ли кто-нибудь сказать мне, что я делаю неправильно?

Журнал ошибок при отсутствии расширения: https://pastebin.com/qzcbXCYQ

EDIT: я идиот. Хранилище было определено в двух файлах, и я не менял тот, из которого его импортировал. Очистил дубликаты, и он работает так, как ожидалось.

3 ответа

Как этот код обрабатывается по отношению к тому, как он написан в документации redux-devtools? https://github.com/auth0-blog/redux-auth/blob/master/index.js#L10-L12 let createStoreWithMiddleware = applyMiddleware(thunkMiddleware, api)(createStore) let store = createStoreWithMiddleware(quotesApp) Я.

Ниже приведен код для включения redux devtool, как я читал в doc, но он не работает, и не имеет значения, закомментирую ли я intialState или нет. import from ‘redux’; import rootReducer from ‘../reducers’; import reduxImmutableStateInvariant from.

Чтобы упростить задачу, вы можете использовать пакет redux-devtools-extension из npm.

Чтобы установить его, запустите:

и использовать так:

У меня была похожая проблема. Мне просто нужно было подправить одну строчку. Я ушел от этого:

В моем случае у меня есть переменная __PROD__ , но настройте ее в соответствии с вашей ситуацией. Логика остается прежней.

Эта проблема обычно возникает в браузерах, не имеющих redux-devtool (также может возникнуть в chrome incognito chrome)

Я думаю, вам следует проконсультироваться с вашим composeEnhancers

Похожие вопросы:

Я пытаюсь добавить расширение Redux DevTools Chrome в свой магазин redux и описать его здесь: http://extension.remotedev.io / Вот мой магазин: let store; const initStore = ().

Когда через jspm / system.js с Вавилонской transpiler, я вижу следующее сообщение об ошибке в консоли Uncaught (in promise) Error: XHR error loading.

Я использую следующий шаблонный пример и пытаюсь настроить его для работы с расширением chrome для redux devtools: import < createStore, applyMiddleware >from ‘redux’ import thunkMiddleware from.

Как этот код обрабатывается по отношению к тому, как он написан в документации redux-devtools? https://github.com/auth0-blog/redux-auth/blob/master/index.js#L10-L12 let createStoreWithMiddleware =.

Ниже приведен код для включения redux devtool, как я читал в doc, но он не работает, и не имеет значения, закомментирую ли я intialState или нет. import from ‘redux’;.

Я использую приведенный ниже пример приложения для изучения angular+ngrx. Пример APM NgRx приложение Я установил расширение Redux firefox. Но всякий раз, когда я запускаю/перезагружаю приложение.

Наше приложение ngrx Angular отлично работает до тех пор, пока мы не удалим Redux Devtools, и в этот момент мы получим ошибки: Вы предоставили недопустимый объект там, где ожидался поток. Вы можете.

Я пытаюсь настроить свое приложение на использование redux-devtools , но оно почему-то не работает. вот мой конфиг перед использованием redux-devtools var persistedState = loadState(); var.

Я использую redux-devtools-extension для разработки приложения React Native: В отладчике React Native он работает, и вы можете видеть, что window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ и.

Источник