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

使用notepad++,您可以选择在浏览器中运行。我如何用Visual Studio Code做同样的事情?


当前回答

一键解决方案,只需从Visual Studio市场安装开放的浏览器扩展。

其他回答

Live Preview扩展刚刚添加了(在Insiders Build now和稳定2023年2月初)改变打开默认浏览器的能力(当你选择在外部浏览器中打开它,而不是在vscode中的另一个选项卡中打开它)。参见添加选项以选择默认外部浏览器。

背景是

Live Preview: Custom External Browser
livePreview.customExternalBrowser

选项:Edge、Chrome、Firefox、无

没有一个浏览器会使用您在操作系统中设置的默认浏览器。新的设置允许您覆盖默认设置与另一个浏览器的目的Live预览扩展打开外部浏览器,通过命令:

Live Preview: Show Preview (External Browser)

在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

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

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中查看你的页面。

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

回答既打开一个特定的文件(名称是硬编码)或打开任何其他文件。

步骤:

Use ctrl + shift + p (or F1) to open the Command Palette. Type in Tasks: Configure Task or on older versions Configure Task Runner. Selecting it will open the tasks.json file. Delete the script displayed and replace it by the following: { "version": "0.1.0", "command": "explorer", "windows": { "command": "explorer.exe" }, "args": ["test.html"] } Remember to change the "args" section of the tasks.json file to the name of your file. This will always open that specific file when you hit F5. You may also set the this to open whichever file you have open at the time by using ["${file}"] as the value for "args". Note that the $ goes outside the {...}, so ["{$file}"] is incorrect. Save the file. Switch back to your html file (in this example it's "text.html"), and press ctrl + shift + b to view your page in your Web Browser.