JS环境下用Redux Toolkit创建Slice为何出现TS布尔类型警告？

核心错误点 #

你存在两个关键问题：

• 状态结构理解偏差：你把initialState设为纯布尔值false，但在reducers里却试图给state.value赋值——布尔类型本身根本没有value属性，这是直接触发警告的原因。
• 忽略VS Code对JS文件的类型检查：哪怕用的是JavaScript，VS Code默认会对JS文件启用TypeScript语法/类型检查（基于Redux Toolkit自带的类型定义），编辑器会自动推断出state是布尔类型，因此提示你state.value不存在。

两种正确写法 #

写法1：保持纯布尔状态（适合简单登录状态） #

既然你的状态就是一个布尔值（登录/未登录），直接修改state本身即可：

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

export const authSlice = createSlice({
    name: 'auth',
    initialState: false, // 未登录状态
    reducers: {
        login: (state) => true,
        logout: (state) => false
    }
});

也可以用完整的返回写法：

login: (state) => { return true },
logout: (state) => { return false }

写法2：使用对象结构（适合未来扩展状态） #

如果以后需要给auth状态添加更多字段（比如用户名、token），可以把初始状态改成对象，这样state.value就合法了：

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

export const authSlice = createSlice({
    name: 'auth',
    initialState: { value: false }, // 用对象包裹布尔值
    reducers: {
        login: (state) => { state.value = true },
        logout: (state) => { state.value = false }
    }
});

为什么JS文件会出现TS警告？ #

VS Code默认开启了checkJs选项（可在设置中搜索javascript.implicitProjectConfig.checkJs查看），再加上Redux Toolkit提供了完整的TypeScript类型定义，编辑器会自动推断出state的类型是布尔值，因此会提示错误。如果想临时关闭警告，可以在JS文件顶部添加// @ts-nocheck注释，但更推荐修正代码逻辑——警告本身是在帮你发现逻辑错误。

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