如何实现vs code编写的代码在浏览器自动刷新显示

如何实现vs code编写的代码在浏览器自动刷新显示

使vs code代码在浏览器自动刷新显示步骤:

1、首先在vs code里面安装一个叫做live Server的插件

点击扩展图标或者使用快捷键F1→输入live Server并点击安装按钮(因为我已经安装了所以图片没有显示这个按钮,而是一个设置的图标)安装live Server步骤图解
安装live Server步骤图解

2、运行live Server插件实现浏览器自动刷新显示渲染后的代码页面

在这里需要注意:每次我们写完代码都要保存之后浏览器才会自动刷新修改过的页面。

手动保存我们使用快捷键Ctrl+S,不过我觉得手动保存还是非常不方便的,此时我们可以将vs code设置为自动保存代码

单击文件→选择自动保存选项
自动保存代码

3、在编写完代码以后,点击Open with live Server运行

运行成功之后可以尝试改动代码,会发现浏览器自动刷新,并呈现修改过后的页面
运行代码
运行代码
(写在最后:新来的小白,希望我的文章能帮到你们,望各位大佬不要嫌弃~)

  • 28
    点赞
  • 26
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值