自动导入不是「什么都能不写 import」:14 个标识符逐个判定

点任意一行,看它到底「自动可用」还是「必须自己 import」,以及正确写法。 判定只有一条主线:Nuxt 只替你自动导入三类东西 —— ① 它自己的内置 API(useFetch / navigateTo / definePageMeta 等)、② Vue 的导出、③ 你的约定目录里的内容(app/components、app/composables、app/utils,server 侧另算)。 其余(第三方包、Node 内置模块、自建目录、配置文件)统统要自己写 import。

「TS / ESLint 说 useFetch 未定义」排查思路

运行时报 undefined 和编辑器报错是两件事,先分清:能跑但编辑器红 = 类型没生成;跑也报错 = 这个名字确实不在自动导入范围内。按下面顺序查:

  1. 先确认它该不该自动导入:打开 .nuxt/imports.d.ts,搜这个标识符。在里面 = Nuxt 认它(export { useFetch, useLazyFetch } from '#app/composables/fetch' 这类行);搜不到 = 它本来就该手写 import,别指望自动导入。
  2. 文件在里面但仍报错 → 是类型产物过期。跑一次 npx nuxt prepare(它只生成 .nuxt/ 里的类型和清单,不启动服务),然后重启编辑器的 TS 服务。
  3. 确认 tsconfig.json 里有 "extends": "./.nuxt/tsconfig.json"。少了这行,编辑器和 Nuxt 的类型世界是断开的,自动导入全在报错。
  4. 自己新建的目录(比如 app/helpers/)想被自动导入,要显式加进扫描范围:imports: { dirs: ['helpers'] };不加就老老实实写 import。
  5. ESLint 报 no-undef:别手写一堆 globals,直接装官方 @nuxt/eslint 模块,让它从 .nuxt/ 生成 flat config;同时把 .nuxt/ 加进 ignores。
  6. 组件名报「未找到」:.nuxt/components.d.ts 里查它的真实标签名(目录前缀会影响它,见上面规则 ②)。
[迷你控制台] 每一行的判定、规则演示、筛选都会在这里留一行