整理一下react的知识点之redux-devtools-extension基本使用(持续更新)

最新推荐文章于 2024-05-13 22:16:07 发布

数组喜欢打对象

最新推荐文章于 2024-05-13 22:16:07 发布

阅读量8.3k

点赞数 1

文章标签： react.js 前端 javascript

本文链接：https://blog.csdn.net/weixin_57435656/article/details/121344026

版权

本文介绍了如何在React项目中整合redux-devtools-extension，包括下载相关包，安装React和Redux的Chrome浏览器插件，以及在store/index.js中的配置步骤。配置完成后，插件在React页面中将高亮显示，实时跟踪和记录每一个redux操作。

摘要由CSDN通过智能技术生成

1. 下载相关包

npm i redux react-redux redux-thunk redux-devtools-extension

2.安装react开发工具（chrome浏览器插件）

3. 安装redux的开发工具（chrome浏览器插件）

4.在store/index.js中进行配置导入

import { createStore, applyMiddleware } from 'redux'
import rootReducer from './reduces'
import thunk from 'redux-thunk'
import { composeWithDevTools } from 'redux-devtools-extension'
const store = createStore(rootReducer, composeWithDevTools(applyMiddleware(thunk)))
export default store

配置完成后进入Chrome浏览器React页面时插件图标会高亮显示