VS Code团队现在有一个官方扩展，叫做“Live Preview”

快速设置:

安装“实时预览”扩展从微软。 从工作空间打开html文件，当前工作空间之外的文件无法工作。 执行命令> Live Preview: Show Preview(外部浏览器)

还有一个命令用于在内部浏览器中启动它。您可能还需要从扩展设置中更改默认端口，以防它已经在您的系统上使用。

文档:https://marketplace.visualstudio.com/items?itemName=ms-vscode.live-server

发布说明:https://code.visualstudio.com/updates/v1_59#_live-preview

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

一些特点:

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

下面是一个2.0.0版本的当前文档在Chrome带键盘快捷方式:

tasks.json

{
    "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}"
            ],
            "problemMatcher": []
        }
    ]
}

快捷键。json:

{
    "key": "ctrl+g",
    "command": "workbench.action.tasks.runTask",
    "args": "Chrome"
}

在web服务器上运行:

https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer

在Opera浏览器中打开文件(Windows 64位)。只要加上这几行:

{
"version": "0.1.0",
"command": "opera",
"windows": {
    "command": "///Program Files (x86)/Opera/launcher.exe"
},
"args": ["${file}"] }

注意command:行的路径格式。不要使用“C:\path_to_exe\runme.exe”格式。

要运行此任务，请打开要查看的html文件，按F1，键入task opera并按enter

@InvisibleDev -让这个在mac上工作尝试使用这个:

{
    "version": "0.1.0",
    "command": "Chrome",
    "osx": {
        "command": "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome"
    },
    "args": [
        "${file}"
    ]
}

如果你已经打开了chrome浏览器，它会在一个新的选项卡中启动你的html文件。

如果你只是在Mac上，这个任务。json文件:

{
    "version": "0.1.0",
    "command": "open",
    "args": ["${file}"],
}

.．.在Safari中打开当前文件(假设扩展名为“.html”)所需要的全部内容。

创建任务。Json，并使用⌘+shift+b调用它。

如果你想在Chrome中打开它，那么:

{
    "version": "0.1.0",
    "command": "open",
    "args": ["-a", "Chrome.app", "${file}"],
}

这将做你想要的，如在打开一个新的标签，如果应用程序已经打开。