点任意一行,看它到底「自动可用」还是「必须自己 import」,以及正确写法。 判定只有一条主线:Nuxt 只替你自动导入三类东西 —— ① 它自己的内置 API(useFetch / navigateTo / definePageMeta 等)、② Vue 的导出、③ 你的约定目录里的内容(app/components、app/composables、app/utils,server 侧另算)。 其余(第三方包、Node 内置模块、自建目录、配置文件)统统要自己写 import。
运行时报 undefined 和编辑器报错是两件事,先分清:能跑但编辑器红 = 类型没生成;跑也报错 = 这个名字确实不在自动导入范围内。按下面顺序查:
.nuxt/imports.d.ts,搜这个标识符。在里面 = Nuxt 认它(export { useFetch, useLazyFetch } from '#app/composables/fetch' 这类行);搜不到 = 它本来就该手写 import,别指望自动导入。npx nuxt prepare(它只生成 .nuxt/ 里的类型和清单,不启动服务),然后重启编辑器的 TS 服务。tsconfig.json 里有 "extends": "./.nuxt/tsconfig.json"。少了这行,编辑器和 Nuxt 的类型世界是断开的,自动导入全在报错。app/helpers/)想被自动导入,要显式加进扫描范围:imports: { dirs: ['helpers'] };不加就老老实实写 import。no-undef:别手写一堆 globals,直接装官方 @nuxt/eslint 模块,让它从 .nuxt/ 生成 flat config;同时把 .nuxt/ 加进 ignores。.nuxt/components.d.ts 里查它的真实标签名(目录前缀会影响它,见上面规则 ②)。