如何使用 Visual Studio Code 在浏览器中查看 HTML 文件

Question

如何使用新的 Microsoft Visual Studio Code 在浏览器中查看我的 HTML 代码？

使用 Notepad++，您可以选择在浏览器中运行。我怎样才能用 Visual Studio Code 做同样的事情？

原文由 user4863890 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

对于 Windows - 打开默认浏览器 - 在 VS Code v 1.1.0 上测试

回答打开特定文件（名称是硬编码的）或打开任何其他文件。

脚步：

1. 使用 ctrl + shift + p （或 F1 ）打开命令面板。

2. 输入 Tasks: Configure Task 或旧版本 Configure Task Runner 。选择它将打开 tasks.json 文件。删除显示的脚本并将其替换为以下内容：

    {
       "version": "0.1.0",
       "command": "explorer",
       "windows": {
           "command": "explorer.exe"
       },
       "args": ["test.html"]
   }

请记住将 tasks.json 文件的“args”部分更改为您的文件名。当您按 F5 时，这将始终打开该特定文件。

您还可以通过使用 ["${file}"] 作为“args”的值将其设置为打开您当时打开的任何文件。请注意， $ 超出了 {...} ，所以 ["{$file}"] 是不正确的。

1. 保存文件。

2. 切换回您的 html 文件（在本例中为“text.html”），然后按 ctrl + shift + b 在 Web 浏览器中查看您的页面。

原文由 yushulx 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

VS Code 有一个 Live Server Extension ，支持从状态栏一键启动。

一些特点：

• 从状态栏一键启动
• 实时重新加载
• 支持 Chrome 调试附件

原文由 Jose Cherian 发布，翻译遵循 CC BY-SA 4.0 许可协议