IntelliSense

IntelliSense 是各种代码编辑功能的统称,包括:代码补全、参数信息、快速信息和成员列表。IntelliSense 功能有时也被称为其他名称,例如“代码补全”、“内容辅助”和“代码提示”。

为您编程语言提供的 IntelliSense

Visual Studio Code 为 JavaScript、TypeScript、JSON、HTML、CSS、SCSS 和 Less 开箱即用地提供了 IntelliSense。VS Code 支持对任何编程语言进行基于单词的补全,但也可以通过安装语言扩展来配置更丰富的 IntelliSense。

以下是 Visual Studio Marketplace 中最受欢迎的语言扩展。选择下方的扩展磁贴以阅读说明和评论,决定哪款扩展最适合您。

IntelliSense 功能

VS Code 的 IntelliSense 功能由语言服务提供支持。语言服务根据语言语义和源代码分析提供智能代码补全。如果语言服务知道可能的补全内容,IntelliSense 建议就会在您键入时弹出。如果您继续输入字符,成员列表(变量、方法等)将会被过滤,仅包含包含您所键入字符的成员。按下 TabEnter 键将插入选定的成员。

您可以在任何编辑器窗口中通过键入 ⌃Space (Windows, Linux Ctrl+Space) 或键入触发字符(例如 JavaScript 中的点号字符 (.))来触发 IntelliSense。

提示

建议控件支持驼峰式命名法 (CamelCase) 过滤,这意味着您可以键入方法名称中的大写字母来限制建议范围。例如,“cra”会调出“createApplication”。

如果您愿意,可以在键入时关闭 IntelliSense。请参阅 自定义 IntelliSense,了解如何禁用或自定义 VS Code 的 IntelliSense 功能。

根据语言服务提供的内容,您可以通过按 ⌃Space (Windows, Linux Ctrl+Space) 或选择 > 图标来查看每个方法的快速信息。该方法的随附文档会在侧边展开。展开的文档会保持可见,并在您浏览列表时进行更新。您可以再次按 ⌃Space (Windows, Linux Ctrl+Space) 或选择关闭图标来关闭它。

选择方法后,系统会为您提供参数信息

parameter info

在适用时,语言服务会在快速信息和方法签名中显示底层类型。在之前的截图中,您可以看到几个 any 类型。由于 JavaScript 是动态语言,不需要也不强制类型,因此 any 表示该变量可以是任何类型。

补全类型

下方的 JavaScript 代码截图展示了 IntelliSense 补全。IntelliSense 同时提供推断出的建议和项目的全局标识符。推断出的符号会首先显示,随后是全局标识符(由 abc 单词图标标示)。

intellisense icons

VS Code IntelliSense 提供不同类型的补全,包括语言服务器建议、代码片段 (snippets) 和简单的基于单词的文本补全。

图标 名称 符号类型
方法和函数 method, function, constructor
变量 variable
字段 field
类型参数 typeParameter
常量 constant
class
接口 interface
结构体 struct
活动 event
运算符 operator
模块 module
属性和特性 property
枚举 enum
枚举成员 enumMember
参考 引用
关键字 keyword
文件 file
文件夹 folder
颜色 color
单位 unit
代码片段前缀 snippet
单词 text

自定义 IntelliSense

您可以在设置和键盘快捷方式中自定义您的 IntelliSense 体验。

设置

下方显示的设置是默认设置。您可以在设置编辑器⌘, (Windows, Linux Ctrl+,))中更改这些设置。

{
    // Controls if quick suggestions should show up while typing
    "editor.quickSuggestions": {
        "other": true,
        "comments": false,
        "strings": false
    },

     // Controls whether suggestions should be accepted on commit characters. For example, in JavaScript, the semi-colon (`;`) can be a commit character that accepts a suggestion and types that character.
    "editor.acceptSuggestionOnCommitCharacter": true,

    // Controls if suggestions should be accepted on 'Enter' - in addition to 'Tab'. Helps to avoid ambiguity between inserting new lines or accepting suggestions. The value 'smart' means only accept a suggestion with Enter when it makes a textual change
    "editor.acceptSuggestionOnEnter": "on",

    // Controls the delay in ms after which quick suggestions will show up.
    "editor.quickSuggestionsDelay": 10,

    // Controls if suggestions should automatically show up when typing trigger characters
    "editor.suggestOnTriggerCharacters": true,

    // Controls if pressing tab inserts the best suggestion and if tab cycles through other suggestions
    "editor.tabCompletion": "off",

    // Controls whether sorting favours words that appear close to the cursor
    "editor.suggest.localityBonus": true,

    // Controls how suggestions are pre-selected when showing the suggest list
    "editor.suggestSelection": "first",

    // Enable word based suggestions
    "editor.wordBasedSuggestions": "matchingDocuments",

    // Enable parameter hints
    "editor.parameterHints.enabled": true,
}

Tab 补全

编辑器支持 Tab 补全,即在按下 Tab 时插入最佳匹配的补全。无论建议控件是否显示,此功能都有效。此外,在插入建议后按 Tab 会插入下一个最佳建议。

默认情况下,Tab 补全处于禁用状态。使用 editor.tabCompletion 在 VS Code 中打开 在 VS Code Insiders 中打开 设置来启用它。支持的值包括:

  • off - (默认) 禁用 Tab 补全。
  • on - 启用所有建议的 Tab 补全,重复触发将插入下一个最佳建议。
  • onlySnippets - Tab 补全仅插入与当前行前缀匹配的静态代码片段。

局部加权 (Locality bonus)

建议的排序取决于扩展信息以及它们与您当前输入的单词的匹配程度。此外,您可以使用 editor.suggest.localityBonus 在 VS Code 中打开 在 VS Code Insiders 中打开 设置,让编辑器提升那些出现在光标位置附近的建议的权重。

Sorted By Locality

在之前的截图中,您可以看到 countcontextcolocated 是根据它们所在的作用域(循环、函数、文件)进行排序的。

建议选择

默认情况下,VS Code 会预选建议列表中的第一项。如果您希望更改此行为(例如,始终选择建议列表中最近使用过的项),可以使用 editor.suggestSelection 在 VS Code 中打开 在 VS Code Insiders 中打开 设置。

可用的 editor.suggestSelection 在 VS Code 中打开 在 VS Code Insiders 中打开 值包括:

  • first - (默认) 始终选择列表顶部的项目。
  • recentlyUsed - 除非通过前缀(键入以选择)选择了不同的项目,否则将选择之前使用过的项目。
  • recentlyUsedByPrefix - 根据之前完成这些建议的前缀来选择项目。

选择最近使用的项目非常有用,因为您可以快速多次插入相同的补全内容。

“键入以选择”意味着当前前缀(光标左侧的文本)被用于过滤和排序建议。当发生这种情况且其结果与 recentlyUsed 的结果不同时,它将被优先考虑。

使用最后一个选项 recentlyUsedByPrefix 时,VS Code 会记住针对特定前缀(部分文本)选择了哪一项。例如,如果您输入 co 然后选择了 console,下次当您输入 co 时,建议 console 将被预选。这让您可以快速将不同的前缀映射到不同的建议,例如 co -> consolecon -> const

建议中的代码片段

默认情况下,VS Code 在同一个控件中显示代码片段和补全建议。您可以使用 editor.snippetSuggestions 在 VS Code 中打开 在 VS Code Insiders 中打开 设置修改此行为。要从建议控件中移除代码片段,请将值设置为 "none"。如果您希望查看代码片段,可以指定它们相对于建议的顺序:顶部 ("top")、底部 ("bottom") 或按字母顺序排序并内联显示 ("inline")。默认值为 "inline"

键盘快捷键

此处显示的键盘快捷方式是默认设置。要分配不同的键盘快捷方式,请使用 键盘快捷方式编辑器⌘K ⌘S (Windows, Linux Ctrl+K Ctrl+S))。

命令 键绑定
editor.action.triggerSuggest ⌃Space (Windows, Linux Ctrl+Space)
toggleSuggestionDetails ⌃Space (Windows, Linux Ctrl+Space)
toggleSuggestionFocus ⌃⌥Space (Windows, Linux Ctrl+Alt+Space)
提示

还有许多与 IntelliSense 相关的键盘快捷方式。打开默认键盘快捷方式文件 > 首选项 > 键盘快捷方式)并搜索“suggest”。

使用 AI 增强补全

GitHub Copilot 会在您于编辑器中键入时提供编码建议。您还可以向 Copilot 询问与编码相关的问题,例如如何最佳地编写代码、如何修复 Bug 或他人编写的代码是如何工作的。

开始使用

  1. 安装 GitHub Copilot 扩展

  2. 通过我们的 Copilot 快速入门了解关键功能。

提示

如果您还没有 Copilot 订阅,可以通过注册 Copilot 免费计划来免费使用 Copilot,并获得每月额度的内联建议和 AI 积分。

故障排除

如果您发现 IntelliSense 停止工作,可能是语言服务未运行。尝试重启 VS Code,这通常能解决问题。如果安装语言扩展后仍然缺少 IntelliSense 功能,请在相应语言扩展的存储库中提出问题。

注意

在非常大的工作区中,出于性能考虑,IntelliSense 功能可能会部分禁用。如果发生这种情况,请尝试使用 files.exclude 在 VS Code 中打开 在 VS Code Insiders 中打开 search.exclude 在 VS Code 中打开 在 VS Code Insiders 中打开 设置来排除大型文件夹(例如 node_modules 或构建输出目录)。

提示

有关配置和排查 JavaScript IntelliSense 的信息,请参阅 JavaScript 文档

特定的语言扩展可能不支持所有的 VS Code IntelliSense 功能。请查看该扩展的 README 文件以了解其支持的内容。如果您认为语言扩展存在问题,通常可以通过 VS Code Marketplace 找到该扩展的问题存储库。导航到该扩展的详细信息页面并选择支持链接。

后续步骤

IntelliSense 只是 VS Code 强大功能的其中之一。请继续阅读以了解更多信息

常见问题

为什么我没有收到任何建议?

这可能是由多种原因引起的。首先,尝试重启 VS Code。如果问题仍然存在,请查阅语言扩展的文档。有关 JavaScript 特定的故障排查,请参阅 JavaScript 语言主题

为什么我看不到方法和变量建议?

image of IntelliSense showing no useful suggestions

这个问题是由 JavaScript 中缺少类型声明(typings)文件引起的。大多数常见的 JavaScript 库都附带了声明文件或提供了类型声明文件。

请确保为您正在使用的库安装了对应的 npm 或 yarn 包。在使用 JavaScript 文章中了解关于 IntelliSense 的更多信息。对于其他语言,请查阅该扩展的文档。

© . This site is unofficial and not affiliated with Microsoft.