RTK Query中onQueryStarted用api.util报错：api未定义或_ref3未定义

解决方案 #

• 显式导入API实例
  你通过createApi创建的RTK Query API实例需要在当前文件中显式导入，才能在onQueryStarted中使用api.util.resetApiState()。修改代码如下：

  // 替换为你的API切片文件实际路径
  import { api } from './features/api/apiSlice'
  
  sendLogout: builder.mutation({
      query: () => ({
          url: '/auth/logout',
          method: 'POST'
      }),
      async onQueryStarted(arg, { dispatch, queryFulfilled }) {
          console.log("onquerystarted")
          try {
              await queryFulfilled
              dispatch(logOut())
              // 使用导入的api实例调用resetApiState
              dispatch(api.util.resetApiState())
          } catch (err) {
              console.log(err)
          }
      }
  }),
  

• 升级RTK Query版本（若需从参数解构api）
  如果你想通过onQueryStarted的第二个参数解构api，需要确保@reduxjs/toolkit版本≥1.9.0——该版本才将api加入onQueryStarted的上下文参数中。升级命令：

  npm install @reduxjs/toolkit@latest
  # 或使用yarn
  yarn add @reduxjs/toolkit@latest
  

• 排查构建工具的Tree Shaking配置
  若上述方法无效，检查Vite、Webpack等构建工具是否开启了过度优化，导致API实例被误判为未使用而移除。可在构建配置中对@reduxjs/toolkit或你的API切片模块添加保留规则。

问题原因 #

本地开发环境的热重载或宽松校验可能允许未显式导入的变量临时生效，但生产构建的严格模式会严格校验变量作用域，未定义的api会直接抛出引用错误。官方文档中“无需声明”指的是api.util.resetApiState是API实例自带的方法，而非不需要导入API实例本身。

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