启用TypeScript严格模式下Redux createStore类型不兼容问题咨询

这个问题我之前也碰到过！在TypeScript严格模式下，Redux的类型检查会变得格外严格——它会注意到你的reducer在初始化时state参数可能是undefined，但你当前的代码只接受{}类型的state，这就导致了类型不匹配的警告。

下面是两种可行的解决方式，你可以根据自己的代码习惯选择：

方式一：先定义基础reducer再包装 #

首先，先明确你的应用状态类型（哪怕是空对象，最好也用接口或类型别名标注，方便后续扩展）：

// 定义你的应用状态类型，后续加字段直接在这里扩展
interface AppState {}

然后写基础reducer的时候，给state设置默认值（处理初始化时的undefined情况），同时标注好类型：

import { createStore, Reducer, AnyAction } from "redux";
import * as storage from "redux-storage";

interface AppState {}

// 基础reducer：给state默认值，确保不会是undefined
const baseReducer: Reducer<AppState, AnyAction> = (state = {}, action) => {
  // 这里替换成你的实际状态处理逻辑，示例先返回空对象
  return state;
};

// 用redux-storage的reducer包装基础reducer
const reducer = storage.reducer(baseReducer);

// 创建store时，初始状态也对应AppState类型
const store = createStore(reducer, {} as AppState);

方式二：直接在包装的reducer里处理 #

如果不想拆分基础reducer，也可以直接在storage.reducer里给state设置默认值并标注类型：

import { createStore, AnyAction } from "redux";
import * as storage from "redux-storage";

// 同样先定义状态类型
interface AppState {}

const reducer = storage.reducer((state: AppState = {}, action: AnyAction) => {
  // 这里写你的状态逻辑
  return state;
});

const store = createStore(reducer, {} as AppState);

核心思路就是：在严格模式下，必须确保reducer的state参数永远不会是undefined——给它设置一个默认值，同时明确标注状态和action的类型，让TypeScript能正确识别redux-storage包装后的reducer类型。

内容的提问来源于stack exchange，提问作者ed'