setupCache报错是因为它不接受裸axios对象，必须传入axios.create()创建的实例，且需先安装axios-cache-interceptor包；正确写法为const axiosInstance = axios.create(); const cachedAxios = setupCache(axiosInstance)。
VSCode里装完Node和axios后，为什么setupCache直接报错？
因为 axios-cache-interceptor 不是 axios 原生功能，必须显式安装并正确包装实例。直接 import 后调用 setupCache(axios) 会失败——它不接受裸 axios 对象，只接受 axios.create() 创建的实例。
实操建议：
- 运行
npm install axios axios-cache-interceptor（不能漏掉后者） - 创建实例再缓存：
const axiosInstance = axios.create(); const cachedAxios = setupCache(axiosInstance); - 别写成
setupCache(axios)或setupCache(axios.default)，这两个都无效 - 注意版本兼容：v1.x 的
axios-cache-interceptor要求 axios ≥ v1.6.0；若用 axios v0.27.x，得降级到axios-cache-interceptor@0.8.9
响应拦截器和缓存拦截器能共存吗？顺序怎么定？
能共存，但顺序错了就失效。缓存必须在响应拦截器「之前」生效，否则你拦截到的可能是已处理过的响应，缓存逻辑根本没机会介入。
正确链路是：请求 → 请求拦截器 → 网络发送 → 响应 → 缓存拦截器（读/写缓存）→ 响应拦截器（统一错误处理/数据转换）
实操建议：
- 先调
setupCache()得到缓存实例，再给它加.interceptors.response.use() - 不要在原始 axios 实例上设响应拦截器，否则缓存层被绕过
- 缓存默认只对 GET、HEAD 请求生效；如需缓存 POST，得手动配置
cache: { ignoreRequest: () => false } - 调试时看 console：缓存命中会打印
[axios-cache-interceptor] cache hit，没这行说明没走缓存
setupCache 默认缓存哪些内容？哪些容易被忽略？
它默认只缓存状态码为 2xx 的响应体（response.data），且仅基于 URL + 请求方法 + 请求参数（query + body）做 key。但 body 是浅比较，对象引用不同就认为是不同请求。
常见坑点：
- POST 请求带 JSON body，默认不缓存——除非显式开启：
setupCache(axiosInstance, { cache: { methods: ['get', 'post'] } }) - body 是对象时，
{id: 1}和{id: '1'}被视为不同 key，缓存不复用 - URL 中带时间戳或随机参数（如
?t=1719752340）会导致每次请求 key 都不同，缓存形同虚设 - 响应头里的
Cache-Control: no-store会强制跳过缓存，后端加了这个头，前端 setupCache 也无效
在 VSCode 里怎么快速验证缓存是否生效？
不用跑整个项目，开个最小可测单元就行。新建 test-cache.js，用 Node 直接跑，比 Vue/React 环境更干净、报错更直接。
实操建议：
- 代码开头加
process.env.NODE_ENV = 'development';，避免生产模式下缓存被静默禁用 - 用
console.time('req')/console.timeEnd('req')对比首次和二次请求耗时 - 关键验证点：第二次请求的
response.config.fromCache字段应为true（这是 setupCache 注入的标识） - 删掉
node_modules/.cache/axios-cache-interceptor目录可强制清缓存，不用重启进程
缓存键生成、body 序列化策略、与 token 动态 header 的兼容性——这些细节不打日志根本看不见，别只盯着 network tab。
