现已发布!阅读有关 11 月份的新功能和修复的信息。

IntelliSense

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

IntelliSense demo

适用于您的编程语言的 IntelliSense

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

以下是 Marketplace 中最受欢迎的语言扩展。选择下面的一个扩展磁贴,阅读描述和评论,以确定哪个扩展最适合您。

IntelliSense 功能

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

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

intellisense in package json

提示: 建议小组件支持 CamelCase 筛选,这意味着您可以键入方法名称中大写的字母来限制建议。例如,“cra”将快速显示“createApplication”。

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

按照语言服务提供的,您可以通过按 ⌃Space(Windows,Linux Ctrl+Space 或单击信息图标来查看每个方法的快速信息。该方法的随附文档现在将扩展到侧面。展开的文档将保持不变,并在您浏览列表时更新。您可以再次按 ⌃Space(Windows,Linux Ctrl+Space 或单击关闭图标来关闭此文档。

quick info

在选择一个方法后,您将获得参数信息

parameter info

如果适用,语言服务将在快速信息和方法签名中显示底层类型。在上图中,您可以看到几个 any 类型。由于 JavaScript 是动态的并且不需要或强制类型,因此 any 表示变量可以是任何类型。

完成的类型

下面的 JavaScript 代码演示了 IntelliSense 补全。IntelliSense 提供推断的建议和项目的全局标识符。推断的符号首先显示,然后是全局标识符(由“单词”图标显示)。

intellisense icons

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

图标 名称 符号类型
method icon 方法和函数 methodfunctionconstructor
variable icon 变量 变量
field icon 字段 字段
type parameter 类型参数 类型参数
constant 常量 常量
class
interface 接口 接口
structure 结构 结构
event 事件 事件
operator 运算符 运算符
module 模块 模块
property 属性和特性 属性
enumeration icon 值和枚举 value, enum
reference 引用 引用
keyword 关键字 关键字
file 文件 文件
folder 文件夹 文件夹
color 颜色 颜色
unit 单位 单位
a square with ellipses forming the bottom show snippet prefix 代码片段前缀 代码片段
a square with letters abc word completion 单词 文本

自定义 IntelliSense

您可以在设置和快捷键绑定中自定义 IntelliSense 体验。

设置

下面显示的设置是默认设置。您可以在 settings.json 文件中更改这些设置,如用户和工作区设置中所述。

{
    // 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 Completion

默认情况下,禁用 Tab 键补全。使用 editor.tabCompletion 设置来启用它。存在以下值

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

局部性加成

建议的排序取决于扩展信息以及它们与您当前键入的单词的匹配程度。此外,您可以使用 editor.suggest.localityBonus 设置,要求编辑器增强在光标位置附近出现的建议。

Sorted By Locality

在上面的图像中,您可以看到 countcontextcolocated 是根据它们出现的范围(循环、函数、文件)排序的。

建议选择

默认情况下,VS Code 预选建议列表中的第一个建议。如果您想要不同的行为,例如,始终选择建议列表中最近使用的项,则可以使用 editor.suggestSelection 设置。

可用的 editor.suggestSelection 值是

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

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

“键入以选择”表示当前前缀(大致是光标左侧的文本)用于筛选和排序建议。当发生这种情况并且其结果与 recentlyUsed 的结果不同时,将优先考虑它。

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

建议中的代码片段

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

快捷键绑定

下面显示的快捷键绑定是默认快捷键绑定。您可以在 keybindings.json 文件中更改这些绑定,如快捷键绑定中所述。

注意: 还有许多与 IntelliSense 相关的快捷键绑定。打开默认键盘快捷方式文件 > 首选项 > 键盘快捷方式),然后搜索“suggest”。

[
  {
    "key": "ctrl+space",
    "command": "editor.action.triggerSuggest",
    "when": "editorHasCompletionItemProvider && editorTextFocus && !editorReadonly"
  },
  {
    "key": "ctrl+space",
    "command": "toggleSuggestionDetails",
    "when": "editorTextFocus && suggestWidgetVisible"
  },
  {
    "key": "ctrl+alt+space",
    "command": "toggleSuggestionFocus",
    "when": "editorTextFocus && suggestWidgetVisible"
  }
]

通过 AI 增强完成

在 VS Code 中,您可以使用人工智能 (AI) 来增强您的编码体验,例如代码行或整个函数的建议、快速文档创建以及帮助创建与代码相关的工件(如测试)。

GitHub Copilot 是一款人工智能驱动的代码补全工具,可帮助您更快、更智能地编写代码。您可以使用 VS Code 中的 GitHub Copilot 扩展来生成代码,或者从它生成的代码中学习。

GitHub Copilot extension in the VS Code Marketplace

您可以在Copilot 文档中了解有关如何开始使用 Copilot 的更多信息。

故障排除

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

提示: 有关配置和排除 JavaScript IntelliSense 故障的信息,请参阅JavaScript 文档

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

后续步骤

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

  • JavaScript - 充分利用您的 JavaScript 开发,包括配置 IntelliSense。
  • Node.js - 在 Node.js 演练中查看 IntelliSense 的实际示例。
  • 调试 - 了解如何为您的应用程序设置调试。
  • 创建语言扩展 - 了解如何创建为新编程语言添加 IntelliSense 的扩展。
  • VS Code 中的 GitHub Copilot - 了解如何使用 AI 和 GitHub Copilot 来增强您的编码体验。

常见问题

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

image of IntelliSense not working

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

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

image of IntelliSense showing no useful suggestions

此问题是由 JavaScript 中缺少类型声明(typings)文件引起的。大多数常见的 JavaScript 库都附带声明文件或具有可用的类型声明文件。请确保为正在使用的库安装相应的 npm 或 yarn 包。在使用 JavaScript 文章中了解有关 IntelliSense 的更多信息。对于其他语言,请查阅扩展的文档。