第一步在vscode中安裝livereload插件
![在这里插入图片描述](https://img-blog.csdnimg.cn/20200217144921892.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwMjI0MjYx,size_16,color_FFFFFF,t_70)
打开livereload
快捷键ctrl+shift+p,搜索livereload,点击打开
![在这里插入图片描述](https://img-blog.csdnimg.cn/20200217145126943.png)
在chrome安装livereload插件
插件下载地址:https://www.jb51.net/softs/568725.html#downintro2
将crx文件的后缀改为.zip并进行解压
进入扩展程序
![在这里插入图片描述](https://img-blog.csdnimg.cn/20200217145704562.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwMjI0MjYx,size_16,color_FFFFFF,t_70)
加载之前解压的插件,即能安装成功
![](https://img-blog.csdnimg.cn/20200217145500614.png)
在chrome中启动livereload
安装成功后,浏览器会出现如下标志
![在这里插入图片描述](https://img-blog.csdnimg.cn/20200217145819439.png)
点击该标志启动插件,即能实现实时刷新的效果
![在这里插入图片描述](https://img-blog.csdnimg.cn/2020021714590645.png)