（已解决）利用LiveReload插件实现vscode和谷歌浏览器实时刷新

说明
最近在研究CSS希望可以提升一个层次。在写DEMO练习的时候老是需要去谷歌浏览器手动刷新页面才能看到更改后的效果次数多了 我也受不了，这不我又请来了个帮手: LiveReload，名如其人，这家伙专门干实时刷新。怎么整？看下面：

实现效果

配置步骤
1.vscode安装LiveRelod
插件处搜索安装即可，不多说。

 

2.启用LiveReload
vscode中按下快捷键ctrl+shift+p搜索配置：live
然后单击第一项，反复单击为启用/禁用 切换。

3.chrome浏览器中安装LiveReload插件。下载链接：

LiveReload（20220412最新）-Javascript文档类资源-CSDN下载

打开chrome的扩展程序–加载解压后的文件夹即可安装完成。

4.vscode和chrome联动
vscode中启用好LiveReload后随便打开一个html网页，然后点击chrome中安装好的LiveReload发现空心的○变成实心的●表示通信成功，

此时去修改html内容就会在chrome中实时刷新呈现。至此大功告成！

大部分教程到这里就结束了~

等等！！！！没效果？？？一直不变实心圆。往下看

查看很多文章，他们都缺少了一步，也是最关键的一步！！

右击html文件，自动打开浏览器，以服务的方式访问文件了!!!（右击没有这句话？）

安装他就有了！！！，然后点击就变实心圆了，折腾一小时，终于找到问题了，如果解决你的问题，请留一下赞！！！谢谢