如果你想要实时重载，你可以使用gulp-webserver，它会监视你的文件更改和重载页面，这样你就不必每次在你的页面上都按F5:

以下是如何做到这一点:

打开命令提示符(cmd)并键入 安装gulp-webserver 在VS Code中输入Ctrl+Shift+P并键入配置任务运行器。选择它并按enter。它将打开任务。Json文件。删除所有内容，然后输入以下代码

tasks.json

{
    "version": "0.1.0",
    "command": "gulp",
    "isShellCommand": true,
    "args": [
        "--no-color"
    ],
    "tasks": [
        {
            "taskName": "webserver",
            "isBuildCommand": true,
            "showOutput": "always"
        }
    ]
}

在项目的根目录中添加gulpfile.js，并输入以下代码:

gulpfile.js

var gulp = require('gulp'),
    webserver = require('gulp-webserver');

gulp.task('webserver', function () {
    gulp.src('app')
        .pipe(webserver({
            livereload: true,
            open: true
        }));
});

现在在VS Code中输入Ctrl+Shift+P并输入“运行任务”，当你输入它时，你会看到你的任务“webserver”被选中并按enter。

您的web服务器现在将在默认浏览器中打开您的页面。现在，您对HTML或CSS页面所做的任何更改都将自动重新加载。

这里是一个关于如何配置'gulp-webserver'实例端口的信息，以及加载什么页面，…

你也可以通过输入Ctrl+P并输入task webserver来运行你的任务

Ctrl + F1将打开默认浏览器。或者你可以按Ctrl + shift + P打开命令窗口，选择“在浏览器中查看”。html代码必须保存在一个文件中(未保存在编辑器上的代码-没有扩展名，不起作用)

VS Code有一个实时服务器扩展，支持一键启动状态栏。

一些特点:

一键从状态栏启动 生活重新加载 支持Chrome调试附件

下面是Mac OSx的2.0.0版本:

{
  // See https://go.microsoft.com/fwlink/?LinkId=733558
  // for the documentation about the tasks.json format
  "version": "2.0.0",
  "tasks": [
    {
      "label": "echo",
      "type": "shell",
      "command": "echo Hello"
    },
    {
      "label":"chrome",
      "type":"process",
      "command":"/Applications/Google Chrome.app/Contents/MacOS/Google Chrome",
      "args": [
        "${file}"
      ]
    }
  ]
}

可能大多数人都能从上面的答案中找到一个解决方案，但看到没有一个对我有效(vscode v1.34)，我想我将分享我的经验。如果至少有一个人觉得它有帮助，那么很酷，不是一个浪费的帖子，amiirte?

无论如何，我的解决方案(窗口)是建立在@noontz的顶部。他的配置可能已经足够旧版本的vscode，但不是1.34(至少，我不能让它工作..)。

我们的配置几乎是相同的，除了一个属性，即group属性。我不知道为什么，但是如果没有这个，我的任务甚至不会出现在命令面板中。

所以。一个工作任务。Json，用于运行vscode 1.34的Windows用户:

{
    "version": "2.0.0",
    "tasks": [
        {
            "label": "Chrome",
            "type": "process",
            "command": "chrome.exe",
            "windows": {
                "command": "C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe"
            },
            "args": [
                "${file}"
            ],
            "group": "build",
            "problemMatcher": []
        }
    ]
}

请注意，这个工作并不需要problemMatcher属性，但是如果没有它，就需要额外的手动步骤。我试过看这房子的文件，但我太笨了，看不懂。希望有人能过来教我，不过先谢谢你了。我所知道的是——包括这个属性和ctrl+shift+b打开当前的HTML文件在一个新的chrome选项卡，麻烦的自由。

一件容易的事。

Mac -在Chrome中打开-在VS Code v 1.9.0上测试

使用Command + shift + p打开命令面板。

输入配置任务运行器，第一次这样做时，VS Code会给你下拉菜单，如果它选择了“其他”。如果你以前这样做过，VS Code会直接把你发送到tasks.json。 一旦进入任务。json文件。删除显示的脚本，替换如下:

｛ “版本”:“0.1.0”, “命令”:“铬”, " osx ": { "command": "/Applications/谷歌Chrome. "应用程序/内容/ MacOS /谷歌Chrome” }， “参数”(" $ {file} ") ｝

切换回你的html文件，按Command + Shift + b在Chrome中查看你的页面。