TypeScript中使用axios.isAxiosError报错:Property 'isAxiosError' does not exist on type 'AxiosStatic'
TypeScript中使用axios.isAxiosError报错:Property 'isAxiosError' does not exist on type 'AxiosStatic'
嘿,我来帮你搞定这个头疼的报错!我之前帮好几个开发者排查过类似问题,多半是axios版本、类型定义冲突或者导入方式的问题,下面给你一步步拆解解决办法:
先检查axios版本是否达标:
isAxiosError这个静态方法是在axios 0.21.0版本之后才新增的,如果你的项目用的是比这个旧的版本,肯定会报这个错。解决起来超简单,直接升级到最新稳定版就行:- 用npm的话:
npm update axios - 用yarn的话:
yarn upgrade axios
- 用npm的话:
清理冲突的第三方类型定义:以前axios需要单独装
@types/axios来获取TypeScript类型,但从axios 0.20.0左右开始,官方已经把类型定义集成到包本身了。如果你之前装过@types/axios,第三方类型包和官方自带类型会打架,导致TypeScript识别不到isAxiosError。- 先卸载第三方类型包:
npm uninstall @types/axios --save-dev - 再确认下
tsconfig.json的配置,确保compilerOptions里有这两项(一般默认就有,但保险起见查一下):{ "compilerOptions": { "moduleResolution": "node", "esModuleInterop": true } }
- 先卸载第三方类型包:
确认导入方式正确:导入方式错了也会导致类型识别异常,一定要用ES模块的导入方式:
import axios from "axios";别用CommonJS的
const axios = require('axios'),除非你特意配置了兼容,但ES模块的方式更稳妥,能保证类型正常识别。
给你个完整的可运行示例代码,你可以参考:
import axios from "axios"; async function fetchExampleData() { try { const res = await axios.get("https://jsonplaceholder.typicode.com/todos/1"); console.log("请求成功: ", res.data); } catch (error) { // 这里的isAxiosError就能正常识别了 if (axios.isAxiosError(error)) { console.log("Axios请求错误信息: ", error.message); console.log("错误状态码: ", error.response?.status ?? "无状态码"); return error.message; } else { console.log("意外错误: ", error); return "发生了一个非请求类的意外错误"; } } } fetchExampleData();
要是按上面的步骤做了还是有问题,不妨重启一下TypeScript语言服务(比如VS Code里按Ctrl+Shift+P,搜索"TypeScript: Restart TS Server"),有时候编辑器的类型缓存会抽风,重启一下就好啦。
内容来源于stack exchange
相关产品推荐
相关产品推荐

