electron-react-boilerplate中Redux报错：Uncaught TypeError: action.custom must be a string

看起来你遇到的这个问题大概率是自定义action的custom字段类型不符合当前环境的Redux校验规则，虽然CRA环境下没有触发报错，但不同环境的依赖版本、中间件配置可能会有差异，导致这个问题显现出来。下面给你几个针对性的排查和解决方向：

1. 先检查自定义action的custom字段类型 #

最直接的原因就是你给action.custom赋值了非字符串类型（比如对象、数字、布尔值等）。有些Redux相关工具（比如特定中间件、DevTools或者高版本的Redux Toolkit）会严格校验这个字段的类型。

举个错误和正确的例子：

// ❌ 错误：custom是对象，会触发类型错误
const myCustomAction = {
  type: 'MY_CUSTOM_ACTION',
  custom: { name: 'test', value: 123 }
};

// ✅ 正确：custom是字符串类型
const myCustomAction = {
  type: 'MY_CUSTOM_ACTION',
  custom: 'test-action-123'
};

如果你的业务需要传递复杂数据，建议把这些数据放到payload字段里，custom字段只保留字符串类型的标识。

2. 对齐CRA环境的Redux依赖版本 #

对比你当前项目和CRA项目的package.json，看看redux、react-redux、@reduxjs/toolkit这些核心依赖的版本是否一致。不同版本的Redux工具可能对action的校验逻辑有变化，比如某些新版本新增了对custom字段的类型校验，而旧版本没有。

如果版本差异较大，可以尝试把当前项目的依赖版本调整为和CRA环境一致，然后重新安装依赖测试。

3. 排查中间件或DevTools的配置 #

如果你在当前项目中使用了额外的Redux中间件（比如redux-logger、自定义中间件）或者Redux DevTools的特殊配置，这些工具可能会对action的格式做额外校验。

• 尝试暂时禁用所有第三方中间件，看看报错是否消失。如果消失了，再逐个排查是哪个中间件导致的问题，调整其配置。
• 如果是DevTools的问题，可以在创建store时添加actionSanitizer配置，处理custom字段的类型：

import { configureStore } from '@reduxjs/toolkit';

const store = configureStore({
  reducer: yourRootReducer,
  devTools: {
    actionSanitizer: (action) => {
      // 把非字符串的custom字段转为字符串，或者直接移除
      if (action.custom && typeof action.custom !== 'string') {
        return { ...action, custom: JSON.stringify(action.custom) };
      }
      return action;
    }
  }
});

4. 检查TypeScript类型定义（如果使用TS） #

如果你用了TypeScript，确保你的action类型定义里custom字段明确标注为字符串类型：

interface CustomAction {
  type: string;
  custom: string; // 这里必须是string类型
  payload?: any; // 复杂数据放到payload里
}

错误的类型定义可能导致编译时没报错，但运行时触发类型错误。

如果以上方法都没能解决问题，建议你贴出自定义action的代码片段、store的配置代码，这样能更精准地定位问题~

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