VSCode怎么在敲代码时自动补全并导入-VSCode-PHP中文网

vscode默认不自动插入import语句，需语言服务就绪、配置javascript.suggest.autoimports和typescript.suggest.autoimports为true，并确保tsconfig.json/jsconfig.json含正确baseurl/paths及重启ts server。

vscode怎么在敲代码时自动补全并导入

VSCode 默认不会在敲代码时自动补全并插入 import 语句——它只在你主动触发补全、且语言服务就绪的前提下，才可能提供带 import 的选项。这不是一个“打开开关就全局生效”的功能，而是一套依赖配置、上下文和插件协同的链路。

为什么输入 useState 后回车没 import？

最常见原因是语言服务根本没加载：右下角状态栏显示 Plain Text 或 Vue (Deprecated)，而不是 TypeScript 或 JavaScript；或者项目根目录缺失 tsconfig.json（TS 项目）或 jsconfig.json（JS 项目）。没有这两个文件，VSCode 就不认为这是模块化工程，import 补全逻辑压根不启动。

验证方式：Ctrl+Shift+P → 运行 Developer: Toggle Developer Tools → Console 标签页输入 require('typescript')，若报 Cannot find module 'typescript'，说明 TS 服务未加载成功。

新建文件后立刻写 useState 没反应？先确认右下角语言模式是否为 TypeScript（点击可切换）
已存在 tsconfig.json 但内容为空？至少保证有 {"compilerOptions": {}}
Vue 单文件中 <template></template> 里写 <mycomp></mycomp> 不提示导入？需安装 Volar（非 Vue Official），且文件语言模式必须是 vue

怎么让 Ctrl+Space 补全时带 import 选项？

关键设置项只有两个，且必须是布尔值 true（不是字符串 "true"）：

"javascript.suggest.autoImports": true 和 "typescript.suggest.autoImports": true

它们控制的是「补全建议被选中时是否自动插入 import」，不是「是否显示建议」。如果补全列表里压根没带 import from 的条目，那大概率是语言服务或配置没到位，而不是这个设置没开。

VSCode

避免常见的 VSCode 错误——设置冲突、调试器配置和扩展冲突。

下载

在设置 UI 中搜索 autoImports，把 JavaScript > Suggest: Auto Imports 和 TypeScript > Suggest: Auto Imports 都勾上
不要和 editor.codeActionsOnSave 混淆——后者管保存时整理 import，前者才是补全时插入的关键
禁用旧版 Auto Import (wix)、ES7+ React/Redux snippets 等插件，它们会劫持原生补全逻辑，导致 Ctrl+Space 只出代码片段、不出 import 项

路径别名（如 @/hooks）导入失败怎么办？

VSCode 完全不读 Webpack/Vite 的 resolve.alias，它只认 tsconfig.json 或 jsconfig.json 里的 baseUrl 和 paths。如果你写了 import { useX } from '@/hooks' 但自动补全总输出 ../../hooks/useX，说明 tsconfig.json 没配对。

正确配置示例（放在 tsconfig.json 的 compilerOptions 内）：

"baseUrl": ".",
"paths": {
  "@/*": ["src/*"]
}

改完后必须重启 TS Server：Ctrl+Shift+P → 输入 TypeScript: Restart TS server。

baseUrl 必须是相对路径（如 "."），不能是 "./" 或绝对路径
paths 的 key 支持通配符（@/*），value 数组里路径也必须以 src/ 开头，不能漏掉 src
JS 项目用 jsconfig.json，结构一致，但不校验类型

要不要装 Auto Import 插件？

官方语言服务能覆盖大多数场景，但 Auto Import（by Juan A. Roldán）插件在以下情况更可靠：

React/Vue/Angular 项目中，组件首次使用后，后续输入能更快触发 import 建议
对非标准导出（如 export default function 或具名 + 默认混合）识别更稳
支持更多语言（如 Svelte、Solid、Qwik）

注意：它和原生补全不冲突，但需确保 javascript.suggest.autoImports 仍为 true，否则插件的自动插入行为也会失效。插件本身不解决语言服务未加载的问题——它只是在语言服务就绪后，增强建议的覆盖率和响应速度。

真正容易被忽略的点是：路径别名配置后不重启 TS Server，或者 tsconfig.json 里 moduleResolution 不是 "node" 或 "nodenext"，这两项一错，@/ 就永远解析失败，补全也无从谈起。