vscode插件 livereload实现网页自动刷新

最新推荐文章于 2024-03-09 15:40:51 发布
最新推荐文章于 2024-03-09 15:40:51 发布
阅读量9.2k 收藏 8
点赞数 1
分类专栏： 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_40224261/article/details/104358101
版权

第一步在vscode中安裝livereload插件

在这里插入图片描述

打开livereload

快捷键ctrl+shift+p，搜索livereload，点击打开
在这里插入图片描述

在chrome安装livereload插件

插件下载地址：https://www.jb51.net/softs/568725.html#downintro2
将crx文件的后缀改为.zip并进行解压
进入扩展程序
在这里插入图片描述
加载之前解压的插件，即能安装成功

在chrome中启动livereload

安装成功后，浏览器会出现如下标志
在这里插入图片描述
点击该标志启动插件，即能实现实时刷新的效果
在这里插入图片描述

佛系小菜鸡
关注
  • 1
    点赞
  • 踩
  • 8
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
专栏目录
vscode 插件 volar
05-07
vscode 插件 volar
VSCode插件开发全攻略之跳转到定义、自动补全、悬停提示功能
08-19
主要介绍了VSCode插件开发全攻略之跳转到定义、自动补全、悬停提示,需要的朋友可以参考下
LiveReload: 快速、高效的前端开发工具
最新发布
gitblog_00002的博客
03-09 391
LiveReload: 快速、高效的前端开发工具 项目简介 LiveReload 是一个强大的实时刷新浏览器工具，它可以帮助开发者在修改 HTML、CSS 或 JavaScript 文件时立即预览更改，无需手动刷新页面。通过集成到您的开发工作流中，LiveReload 可以显著提高您的工作效率。 项目地址：https://gitcode.com/mockko/livereload?utm_sour...
计算机简谱转五线谱乐谱,五线谱如何转成简谱-五线谱转简谱图文教程 - Iefans...
weixin_42511832的博客
07-26 4971
五线谱如何转成简谱？很多朋友在使用中都存在这个疑惑，那就来看看iefans小编为大家分享的五线谱转简谱图文教程吧，感兴趣的朋友可以了解一下哦~方法/步骤分享：1、在电脑上打开EOP NMN Master。2、在EOP NMN Master主页左上角的文件中点击新建。3、在新建曲谱中点击下一页。4、在谱表类型和速度中点击下一页。5、在页面设置中点击确定。6、在EOP NMN Master左上角点击文...
vscode保存代码，浏览器自动刷新页面
y1238r的博客
08-18 1万+
介绍vscode编辑器，保存代码，自动刷新浏览器页面的2种扩展方式。即Live Server和Preview on Web Server扩展。
Spring Boot LiveReload 插件使用
泠青沼
03-28 969
监视页面上的源文件， 更新源文件时重新加载页面或仅重新加载更改的样式表，监视器包括页面上的脚本、样式表和/或框架，以使用可配置的规则进行更改。 重新加载整个页面或仅重新加载已更改的源文件。
利用LiveReload插件实现vscode和谷歌浏览器实时刷新
老徐的博客只有干货
12-14 1590
说明 最近在研究CSS希望可以提升一个层次。在写DEMO练习的时候老是需要去谷歌浏览器手动刷新页面才能看到更改后的效果次数多了 我也受不了，这不我又请来了个帮手: LiveReload，名如其人，这家伙专门干实时刷新。怎么整？看下面： 实现效果 配置步骤 1.vscode安装LiveRelod 插件处搜索安装即可，不多说。 2.启用LiveReload vscode中按下快捷键ctrl+shift+p搜索配置：live 然后单击第一项，反复单击为启用/禁用 切换。 3.chrome浏览器中安装Li
cocos creator 一种修改工程代码实时刷新页面的方法
喜欢吃一口烤肉的啵啵
07-24 1997
cocos creator 支持javascript作为逻辑脚本语言，生成的页面默认为7456端口，调试通过访问http://localhost:7456，目前阶段的cocos creator 因各种原因并未有更好的实时刷新方案，作为经常使用weppack hot 实时更新页面功能的前端开发者来说，实在不能忍受，官方提供的方案也是通过vscode来手动触发快捷键去刷新页面，详细可以查看 [https://docs.cocos.com/creator/manual/zh/scripting/coding-se
vsCode自动保存与浏览器自动刷新
m0_59989185的博客
09-07 8587
vsCode自动保存与浏览器自动刷新
Vscode常用插件及设置(前端版，实时更新ing
cy6661的博客
01-08 4986
vscode常用插件，可供参考
VScode下安装Live Server（自动刷新html页面）
追求卓越583的博客
08-30 5084
VScode下安装Live Server（自动刷新html页面）
vscode 插件插件插件插件插件插件插件
07-14
vscode 插件插件插件插件插件插件插件
vscode插件包.rar
08-05
中文插件 C++插件等
Sublime Text 全程图文指引、Notepad++ 简单使用
freeking101的博客
11-21 1万+
Sublime Text 全程图文指引、Notepad++ 简单使用
LiveReload的下载安装 + Sublime的配置
weixin_44066534的博客
07-23 489
之前一直用VS Code做前端开发，前段时间被种草了Sublime后确实感觉到Sublime插件功能的强大，后来为了方便做页面开发下载了LiveReload这个插件，再也不用每次修改页面样式都按一次刷新真的是太爽了。 为了在Chrome中下载这个插件确实费了一凡功夫。下面记录一下我安装成功的过程，希望能给安装LiveReload的你们一点帮助。 第一步：下载插件???? 由于我的电脑没有翻墙，先在网上下了插件再安装: （翻墙了的小伙伴好像可以直接在google应用商城下载安装） 点此下载插件：Chrome插
browserify_Browserify入门
culiu9261的博客
07-19 2251
browserifyBrowserify changed my life. Browserify改变了我的生活。 . . . My life as a Javascript developer, anyway. Unlike many of my peers--maybe most of them--I don't enjoy writing UIs. Hacking together cli...
VScode浏览器自动刷新插件
流楚丶格念的博客
05-03 6340
安装插件 Live Server OK
Vscode插件 livereload配合chrome扩展程序livereload实现网页自动刷新(保存时)
Evil__的博客
10-12 9095
前段时间电脑系统坏了，重新装系统后便是繁琐的软件重装了（对于程序猿来说，开发环境才是大事），这不，重装vscode插件livereload时，竟然忘了它怎么用了！！！？于是有要百度一波，但是，查了好几个博客才解决了我的问题。。。怪自己记性不好啦。。。好的，进入正题。 第一步，下载并安装vscode插件livereload： 搜索插件livereload，选择第一个并点击安装，安装完成后点...
VSCode设置网页代码实时预览
热门推荐
TianXinCoord的博客
10-14 18万+
目录 一、设置描述 二、操作步骤 一、设置描述 1.VSCode作为一款很不错的开发软件，相比DW更小巧，用来测试前端特别不错，那么我们平时开发网页发现只有写完代码，然后保存，接下来到浏览器中刷新查看效果，然后不停重复，我们发现很多时间就这样浪费到了这三个步骤上。 2.其实我们可以在VSCode中配置一个网页服务器，修改完代码之后只需要保存代码浏览器就可以实时预览 二、...
vscode插件liveserver
03-16
liveserver是一款非常实用的VSCode插件，它可以帮助开发者在本地快速启动一个本地服务器，以便于在浏览器中实时预览网页的效果。使用liveserver插件，开发者可以省去手动刷新浏览器的麻烦，从而提高开发效率。此外，...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值