要关闭javascript/typescript的自动导入提示,需在settings.json中分别设置"javascript.suggest.autoimports": false和"typescript.suggest.autoimports": false;vue单文件中也依赖后者,且volar不提供独立开关,故必须显式禁用。

如何关闭 JavaScript/TypeScript 的自动导入提示
VSCode 默认会在代码补全时推荐来自其他模块的导出项(比如输入 useE 弹出 useEffect 并自动插入 import { useEffect } from 'react'),这个行为由语言服务控制,不是“格式化”或插件附加功能。
要彻底关闭提示本身(即不让它出现在补全列表里),只需禁用对应语言的 suggest.autoImports 设置:
- 打开
settings.json,添加或修改:
"javascript.suggest.autoImports": false, "typescript.suggest.autoImports": false
注意:这两项必须分别设置,typescript 配置不会继承给 javascript 文件;Vue 单文件中 <script setup></script> 也依赖 typescript.suggest.autoImports(需搭配 Volar,Vetur 已弃用)。
如何禁用保存时自动组织 import(删未用、重排序)
很多人误以为关掉 editor.formatOnSave 就能阻止 import 被动调整,其实不是——这是独立的 Code Action,由 editor.codeActionsOnSave 控制。
只要配置里存在 "source.organizeImports": true,保存就会触发删除未使用项 + 按字母重排 + 合并重复路径等操作。
关闭方法很简单:
- 在
settings.json中移除或设为false:
"editor.codeActionsOnSave": {
"source.organizeImports": false
}
如果该字段还包含 "source.fixAll.eslint" 或 "source.removeUnusedVariables",建议一并删掉或设为 false,避免行为耦合或执行顺序冲突。
Vue 项目中 Volar/Vetur 对自动导入的影响
Vue 用户容易混淆:Vetur 和 Volar 处理自动导入的方式完全不同。Vetur(已归档)默认开启 vetur.completion.autoImport,而 Volar(当前推荐)完全依赖 TypeScript 语言服务,不提供独立开关。
如果你仍在用 Vetur 并想关掉组件路径自动补全(如输入 <fo> 就补全 <code><foocomponent></foocomponent> 并加 import),需显式关闭:
- 在
settings.json加:
"vetur.completion.autoImport": false
若已迁移到 Volar,则无需此配置;但务必确认 typescript.suggest.autoImports 是 false,否则 <script setup></script> 里仍会自动插入 import。
为什么关了设置还是有自动导入?检查这三处
常见失效原因不是配置没写,而是被更高优先级来源覆盖:
-
.vscode/settings.json中的项目级配置会覆盖用户级设置,先检查它是否意外启用了autoImports或codeActionsOnSave - 某些插件(如 ESLint、Prettier、TypeScript Hero)会自行注册 Code Action,即使 VSCode 原生关了,它们仍可能在保存时调用 organizeImports
- 工作区设置了
"typescript.preferences.includePackageJsonAutoImports": "auto"(较新 TS 版本),它会让import补全包含package.json中的 exports,这个开关独立于suggest.autoImports
最稳妥的排查方式:打开命令面板(Ctrl+Shift+P),运行 Developer: Toggle Developer Tools,切到 Console 标签页,输入 languageFeatures 查看当前激活的语言特性,确认没有插件劫持了 import 相关 provider。











