经常用Vscode水前端的我表示很难受,虽然[HTML Preview]这个拓展非常好用,但是对于多屏幕玩家(比如我)就非常不友好了。即使掏出足够的毛爷爷购买附屏,还是只能主窗口分一半preview。这里介绍用Auto Save和Auto Refresh达到的分屏预览,简单到甚至不需要脑子。

0.准备

你需要:
一个Chrome浏览器 一只Vscode 脑子(可选)

1.安装Chrome拓展

如果你有神奇的工具的话,就可以直接打开这个拓展的安装链接了。

当然,如果你没有神奇工具,我这也提供下载链接

下载:https://www.lanzous.com/i8tsj4d
密码:tbblpw

然后就可以设置定时刷新了,像这样
定时刷新拓展

2.设置自动保存

文件-首选项-设置可以调整自动保存周期,推荐After Delay并且把delay设置成1000ms
如果想要更快的Preview,那么就把delay整小点。
然后就可以文件-自动保存打开自动保存
当然也可以按F1调出命令行,输入toggle auto save来打开自动保存开关。
自动保存

3.整好了

新建一个test.html,在浏览器中打开本地文件,启用自动刷新。
稍微打点东西,就有即时预览了。

顺带一提 如果使用了HTML Formatter,记得F1 Formatter Config中把On Save关掉,不然你根本打不了代码。
Onsave false

效果图(虽然一点效果都看不出来

效果图

Last modification:January 23rd, 2020 at 01:10 pm
如果我的文章对你有帮助,请赞助我吧~