关于VScode打开HTML相关问题

故事的起因

今天重新捡起HTML，当然是用起了最方便的VScode这个神器。不过在新建一个HTML文件温习的时候，发现不能用Live Server打开HTML文件。

我以为是长时间不用它，就像螺丝会生锈，小孩子耍脾气一样，我也想换了一种途径。在搜工具的时候意外发现下面这个工具（open in browser）特别好用，能直接打开我的HTML文件。

 

最后呢，不仅发现了这个工具，也找到了live server无法使用的原因。

总结

1. live server 只能给资源管理器中文件夹或工作空间的HTML使用，不可以给直接的HTML文件打卡。但是open in browser没有这个限制。 

2. open in browser：url显示的是电脑存储的默认路径，访问的是项目保存的电脑地址,会存在图片加载不出来问题。同时访问的页面是静态页面，也就是，在写代码的同时，在工作区保存了代码之后，还需要另外到浏览器页面进行刷新才能看到最新的效果，在开发时较麻烦。

3.open with live server：url是以127.0.0.1开头，即使用web服务器打开，可以解决掉前面图片不显示的问题。（5500是端口号）在这里访问的是动态直播页面，也就是在写代码时，只需要在工作区进行保存，浏览器端的页面就会同时进行更新显示效果。

个人建议：开发过程中，以及大规模的学习要建立好文件夹学习。个人推荐使用live server，这个还是学习前端特别棒的一个工具。记得养成用VScode打开文件“夹”的习惯。