在日常的前端开发中，效率往往藏在这些小细节里。比如在 Visual Studio Code 里写完一个 HTML 文件，能不能直接右键一点就打开浏览器运行？答案是肯定的，而且配置起来也不麻烦。下面就把具体操作拆开来讲。

安装扩展

VS Code 本身不提供这个右键运行功能，得靠扩展来补上。

• 打开 VS Code 的扩展面板（快捷键 Ctrl+Shift+X）。
• 搜索“Open in Browser”这个扩展，找到后直接安装。

这个扩展的作用很简单：你右键单击 HTML 文件，就能看到“Open in Browser”选项。点一下就直接用浏览器打开了，省得去文件管理器里双击或者敲命令行。

配置默认浏览器

扩展装好后，默认会调用系统默认浏览器。但如果你想固定用 Chrome 或 Firefox，可以手动设置一下。

• 点开左下角的齿轮图标，选择“设置”。
• 在搜索框里输入“open in browser”，找到对应的配置项。
• 把“default browser”改成你习惯用的浏览器名字，比如 chrome 或 firefox。

这一步不是必须的。但如果你常用某个浏览器做调试，提前设好能省一步选择。

右键运行

配置完成后，在 VS Code 里打开一个 HTML 文件。在文件上点右键，菜单里会多出一个“Open in Browser”选项。点击它，文件就会自动在之前设置的默认浏览器里打开。

另外，如果你电脑上装了多个浏览器，右键菜单里还能看到“Open in Other Browsers”子菜单。这样你可以快速在不同浏览器下测试兼容性。

整个过程下来，完全不用碰命令行，也不用手动去拖文件。对于需要频繁预览和调试的开发者来说，这个小技巧确实能省下不少时间。无论是刚入门的初学者，还是写了多年代码的老手，只要用 VS Code 做前端，这个功能都值得配置上。

《夸克》非常好用的免费AI浏览器

下载APP查看