visual-studio-code - 如何在 Visual Studio Code 中打开网页预览？

Question

鉴于 Visual Studio Code 基于 Chrome web kit



我们可以在编辑器中将预览作为面板打开吗？

根据 this page ，这个功能要求很高!

Answer 1

现在，基于 Dan Shryock 的回答 here和 this post ，这是我所做的:

安装 nodejs然后实时服务器npm install -g live-server

运行 live-server在项目文件夹

在其中创建一个 live-view.md 文件(把它放在你想要的任何地方。我把它放在我所有项目的基本文件夹中，因为我可以将它用于我目前正在做的任何事情):
<div style="border:1px solid #777;position:absolute;left:10px;top:10px;bottom:10px;right:10px;">
<iframe src="http://localhost:8080/"; width="100%" height="100%" frameborder="0" />
</div>

在 VS Code 的第二个/拆分 Pane 中打开 live-view.md，然后单击“打开预览”按钮(文件的右上角)。

现在，每当我保存时，我都会看到实时预览中显示的更改。