【问题标题】:How to open HTML file in vscode like in browser?如何像在浏览器中一样在 vscode 中打开 HTML 文件?
【发布时间】:2018-04-28 08:10:47
【问题描述】:

vscode 或任何扩展更新完成后,版本说明将显示在 vscode 中。我在电脑里能找到releasenote,是html文件,我用vscode打开,vscode显示的是html代码,不喜欢用浏览器打开。

一般来说,我想在浏览器以外的vscode中查看html。我在网上搜索过,都是用vscode打开浏览器,查看html文件。

我知道vscode可以做到,但我不知道怎么做,啊哈。

谢谢。

【问题讨论】:

  • 是什么阻止你在 VScode 和浏览器之间分割屏幕——或者在 VScode 和浏览器的两个全屏之间切换?要求这是完全错误的事情,因为您创建的 HTML 需要在您定位的任何浏览器或平台上工作,在 VScode 中正确显示。如果你想用 VScode 作为浏览器,你做错了

标签: visual-studio-code


【解决方案1】:

VS Code 不包含对预览 html 页面的内置支持。可以提供by an extension

如果您有兴趣自己实现此功能,请查看webview api

但是,正如@herrbischoff 所说,您应该考虑改变您的工作流程或期望。合适的浏览器将提供更好的开发体验,并且像 browser sync 这样的扩展可以将 VS Code 连接到您选择的浏览器

【讨论】:

    【解决方案2】:

    现在 Visual Studio(VS) Code 已内置支持在编辑器中浏览 HTML 页面。您可以按照以下步骤在新标签页中打开类似窗口的浏览器:

    1. 打开命令调色板(Ctrl + Shift + P
    2. 选择“简单浏览器:显示”
    3. 输入网址/网址
    4. Enter

    如果您想切换到 Chrome 或 Edge 等真正的浏览器并在那里打开页面,那么 VS Code 会为其提供快捷方式。请参阅下面屏幕截图中右上角以黄色突出显示的按钮。单击后,它将按照您 PC 的默认浏览器设置打开 HTML 页面。

    需要注意的一点是 VS Code 的内置浏览器与 Chrome 或 Edge 等常规浏览器的行为有所不同。您不能直接从磁盘加载任何 HTML 文件,除非您将其托管在 Web 服务器中,例如Live Server extension in VS Code、NPM 服务器、IIS 等。因此,您无法通过提供 C:\temp\mypage.html 之类的路径在 VS Code 浏览器选项卡中打开 HTML 文件。它必须是一个 Web URL,例如http://localhost/mypage.html.

    致谢:John Henry's answer

    【讨论】:

      猜你喜欢
      • 2021-08-05
      • 2018-03-03
      • 2017-04-15
      • 2014-04-07
      • 2011-12-18
      • 1970-01-01
      • 2022-06-25
      • 1970-01-01
      • 2015-09-06
      相关资源
      最近更新 更多