Visual Studio Code 现在支持基准

Rick Viscomi

发布时间：2025 年 5 月 20 日

现代代码编辑器将您高效构建所需的一切工具和参考文档汇集在一起，从而大幅提升工作效率，这正是 IDE 中的“集成”的含义。许多 IDE（例如 Visual Studio Code [VS Code]）的一项效率提升功能是，当您在编辑器中将鼠标悬停在 Web 功能上时，系统会显示有关这些功能的其他信息。此信息包含功能说明、支持的浏览器、语法指南以及指向 MDN 上相关信息的链接。

浏览器兼容性信息在 IDE 环境中尤其有用，因为您只需将鼠标悬停在某个功能上，即可立即获得有关该功能互操作性的反馈。您可以根据这些信息来确定某项功能是否符合您的浏览器支持目标，是否需要采取防御性措施来逐步增强或 polyfill 该功能，或者完全不使用该功能。

早期的 VS Code 会以浏览器版本号的形式表达此信息，类似于您可能在 MDN、Can I Use 或 web.dev 等网站上的兼容性表格中看到的信息。但所有这些网站的共同点在于，它们也开始使用 Baseline 来总结复杂的浏览器支持情况。因此，为了使 VS Code 与其他资源传达浏览器兼容性信息的方式保持一致，VS Code 现在也支持 Baseline。

如需获取新的 Baseline 界面，请升级到 VS Code 版本 1.100 或更高版本。一切都可直接使用，无需扩展程序或额外配置。

在最新版 VS Code 中，当您将鼠标悬停在某个 Web 功能上时，会看到其 Baseline 状态。为了让您了解相应功能已获得支持的时间，VS Code 还会告知您该功能成为 Baseline 的年份。或者，对于尚未达到 Baseline 标准的功能，它会告知您哪些浏览器尚未完全实现该功能。

在早期版本的 VS Code 中，这并不是那么简单。查看受支持的浏览器版本列表并找出缺少的浏览器需要费一番心思。或许最难弄清楚的是，该功能在各种浏览器中受支持的时间有多长。为此，您需要知道每个版本的发布时间，但这并不是广为人知的信息！幸运的是，所有这些因素都已纳入 Baseline 状态和年份。

此版本还包含一些全新功能。以前，您只能调出 CSS 属性的浏览器支持数据。鉴于每年都有大量新的 CSS 功能发布，这尤其有用。不过，HTML 方面也在不断创新！自此版本起，VS Code 还将开始显示 HTML 元素和属性的浏览器支持信息（以 Baseline 状态表示）。

例如，autocorrect 输入源属性是在其第一个浏览器 Firefox 中发布的，距今只有几个月的时间。能够立即获得有关该功能可用性有限的反馈，有助于您更清楚地了解该功能在哪些情况下可用或不可用。在这种特定情况下，在不受支持的浏览器中使用它不会造成任何危害，因此请放心使用！

其他 HTML 功能（例如 dialog 元素）的降级效果不如 autocorrect 那么好。因此，能够调用 dialog 悬停卡片并看到该功能自 2022 年以来一直处于 Baseline 状态，并且被认为在各大浏览器中广泛可用，这令人放心。类似这样的功能应该能让您放心地采用您可能认为过于前沿的功能。

弹出式窗口 API 是另一个已成为基准的 HTML 功能示例，但它是在 2024 年才成为基准的，因此仍被视为“新近可用”。这意味着，虽然所有主流浏览器都支持它，但它尚未达到成为“广泛可用”功能所需的 2.5 年时间。因此，在向所有用户发布此功能之前，您可能需要更加谨慎地进行操作。

在 VS Code 中随时获取此信息可大幅提高工作效率。但是，如果您甚至不需要将鼠标悬停在某个功能上，就能知道它是否属于基准功能，那该有多好？这是通过一个单独但相关的工具（即代码检查器）实现的。

例如，VS Code 的 ESLint 扩展程序可以对 HTML 和 CSS 文件进行代码检查，并为任何尚未达到 Baseline 标准的功能添加波浪下划线。此功能由最近从 HTML ESLint 和 ESLint for CSS 插件添加的 use-baseline 规则提供支持。如果您喜欢 Stylelint，也可以使用类似的规则。当然，这只是代码检查工具的众多优势之一，但它表明了代码检查工具与启用基准的悬停卡片相得益彰。

如果您是 VS Code 用户，我希望您尝试一下新的悬停卡片。如果您不是 VS Code 用户，我这里有一个非常好的消息。许多 IDE 要么是从 Code - OSS（VS Code 的开源版本）派生而来，要么依赖于为其 HTML 和 CSS 悬停卡提供支持的相同语言服务器。这些下游 IDE 可能需要数周或数月才能升级到最新版本，但升级后，它们应会自动继承新的 Baseline 界面：

• VSCodium
• Firebase Studio
• 光标
• Windsurf
• Zed
• Eclipse Theia
• 特雷
• GitHub Codespaces
• GitLab 工作区
• Replit
• StackBlitz (Bolt)

JetBrains 也在努力将 Baseline 与其所有基于 IntelliJ 的 IDE 集成，首先是 WebStorm。我们会在另一篇博文中详细介绍这一点，敬请期待。

越来越多的开发者工具和资源开始支持 Baseline，而 VS Code 率先推出的这些新的 IDE 集成功能尤其令人兴奋。我们在 IDE 中花费了大量时间，而触手可及的基准数据将有助于提高开发工作流程的清晰度和跨工具一致性。如需详细了解 Baseline 和其他此类工具集成，请前往我们的 Baseline 指南获取更多资源。