我试图为这个简单的NextJS应用程序设置Redux—Devtools扩展与Redux,但配置不工作.我在增强器上遇到了问题,不知道如何解决这个问题.
我阅读了Redux文档,但无法找到让它工作所需的正确信息.这是一个很大的帮助.
我收到的VS代码错误是:
类型'(... args:any [])= unknown)[]'不能分配给类型> '(getDefaultEnhancers: GetDefaultEnhancers Tuple [ThunkMiddleware CombinedState {cards:<<<< CardState;},UnknownAction])=元组.&>>>>>< gt...
预期的类型来自属性'增强器',它声明 在这里输入'ConfigureStore Options CombinedState {cards:CardState;<< },UnknownAction,Tuple [ThunkMiddleware CombinedState {cards:><<< CardState;},UnknownAction],元组.&>>>< gt;,CombinedState.&< gt;'>
Store.ts
import { configureStore } from "@reduxjs/toolkit";
import { composeWithDevTools } from "@redux-devtools/extension";
import {
TypedUseSelectorHook,
useDispatch as useAppDispatch,
useSelector as useAppSelector,
} from "react-redux";
import { applyMiddleware, compose } from "redux";
import rootReducer from "./rootReducer";
// And use redux-batched-subscribe as an example of adding enhancers
// ----------------------------------------------------------------------
// Define the root state type using the ReturnType utility of TypeScript
export type RootState = ReturnType<typeof rootReducer>;
// Define the type for dispatching actions from the store
export type AppDispatch = typeof store.dispatch;
const composeEnhancers = compose(
applyMiddleware,
composeWithDevTools()
);
const store = configureStore({
reducer: rootReducer,
middleware: (getDefaultMiddleware) =>
getDefaultMiddleware({
serializableCheck: false,
immutableCheck: false,
}),
devTools: process.env.NODE_ENV !== 'production',
enhancers: [composeEnhancers],
});
// Extract the dispatch function from the store for convenience
const { dispatch } = store;
const useSelector: TypedUseSelectorHook<RootState> = useAppSelector;
// Create a custom useDispatch hook with typed dispatch
const useDispatch = () => useAppDispatch<AppDispatch>();
// Export the Redux store, dispatch, useSelector,
// and useDispatch for use in components
export { store, dispatch, useSelector, useDispatch };