redux配置中间件后，redux调试工具DEVTools不能用,这可咋整

redux配置中间件后，redux调试工具DEVTools不能用,这可咋整

我的第一篇技术博客，请各位大佬多多指点，问题如上，我使用的是redux-think中间件，主要用来存放一些ajax请求，配置过程仿照官网，使用webpack来配置
打开控制台输入，首先进入我们创建的项目中

npm install --save redux-thunk

安装完成后，打开store下的index.js

import { createStore , applyMiddleware } from 'redux'
import reducer from './reducer'
import thunk from 'redux-thunk'
const store = createStore(
    reducer,
    applyMiddleware(thunk)
)
export default store

正常来说到这一步，中间件就已经配置好了，也是完全可以使用了，但是如果之前安装过DEVTools的话，store里面多一个

const store = createStore(
    reducer,
    window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
)

由于createStore只能接受两个参数，写了applyMiddleware就不能写DEVTOOLS，这就很尴尬了，二选一，怎么办？
有句话叫没本事才做选择题，有钱人全都要
这时候需要我们创建一个增强函数，就是在执行完applyMiddleware的时候再执行DEVTOOLS，骗createStore，让他以为只有reducer和增强函数两个参数，其实函数里面包含了两个。

import { createStore , applyMiddleware， compose } from 'redux'
import reducer from './reducer'
import thunk from 'redux-thunk'
const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__?
window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({}) : compose
const enhancer = composeEnhancers(applyMiddleware(thunl))
const store = createStore(
    reducer,
    enhancer
)
export default store

本文知识点是从B站UP主 “技术胖”视频中学习到的，对自己学习工作有帮助所以进行了记录，如果涉及侵权，请联系我删除，前端小菜鸟，请大佬手下留情。