LiveReload插件安装、配置及用法

Sublime Text 3 实时预览
最新推荐文章于 2025-08-20 16:31:17 发布
原创 最新推荐文章于 2025-08-20 16:31:17 发布 · 2.5w 阅读 · 9 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#Sublime #Chrome #LiveReload #用法

本文介绍如何在Sublime Text 3中通过安装LiveReload插件实现与Chrome浏览器的实时同步预览功能。具体步骤包括插件的下载、安装及配置，最后演示如何在Sublime Text 3中修改代码并在Chrome中即时查看效果。

1.浏览器端
下载
这里写图片描述

这里写图片描述

这里写图片描述

这里写图片描述
安装
这里写图片描述

2.Sublime text3端
下载/PCIP安装，在windows环境下无效
https://github.com/Grafikart/ST3-LiveReload
这里写图片描述

安装
解压，重命名，拷贝到packages中
这里写图片描述

这里写图片描述

这里写图片描述

这里写图片描述

配置
这里写图片描述

这里写图片描述

{"enabled_plugins": ["SimpleReloadPlugin","SimpleRefresh"]}

这里写图片描述

3.用法
重启 Sublime text3和Chrome，点击 Chrome的LiveReload 图标，空心变实心，LiveReload启动并连接成功
这里写图片描述

Line 1, Column 1: New LiveReload v2 client connected.
这里写图片描述

至此，Sublime text3中的任何变化，ctrl+s后，立即在Chrome中看到相应变化

livereload chrome插件
08-22
livereload chrome插件
chorme liveReload插件
10-20
chorme liveReload 是chorme的一个插件 结合grunt 可实现实时刷新
Chrome LiveReload插件：前端开发效率革命
最新发布
weixin_42327217的博客
08-20 965
在前端开发中，开发者通常需要频繁地修改样式和代码，并希望立即看到变化效果，传统方法依赖于手动刷新浏览器，这种方法不仅效率低下，还可能打断开发思路。为了克服这一问题，Chrome的LiveReload插件应运而生，它能够在文件发生变化后自动刷新浏览器，帮助开发者实现所见即所得的开发体验。
LiveReload
04-10
web 前端修改 自动刷新 插件 与sublime Text3 一起使用
web开发时自动刷新网页：liveReload安装，sublime 3
weixin_34372728的博客
10-20 308
需要插件 sublime text3：View in Browser；LiveReload chrome：liveReload 配置方法 一：sublime text3 sublime 3下载地址： http://download.csdn.net/download/reggergdsg/9541966 1、在sublime text3安装插件 view in b...
LiveReload.rar
06-29
而`livereload_2_1_0_.zip`可能是一个旧版本的LiveReload插件或相关配置文件，如果当前的LiveReload版本不兼容或出现问题，可以尝试回退到此版本看看是否能解决问题。 总之，通过VS Code和Chrome的LiveReload功能，...
Live Reload-crx插件
03-09
使用可配置规则监视页面上包含的脚本，样式表和/或框架以进行更改。 重新加载整个页面或仅重新加载已更改的源文件。 显示带有当前页面上监视的文件数量的徽标（可以关闭）。 要调试监视规则，请导航至chrome：// ...
Chrome浏览器LiveReload插件使用指南
将 LiveReload 打包为 Chrome 插件的格式，意味着用户可以通过 Chrome 的扩展程序商店直接安装，或者通过解压安装的方式快速地使用该工具，这对于不熟悉命令行操作的用户而言是非常便利的。 **4. 与编辑器的协同...
liveReload插件在sublime text与Chrome中的高效同步使用指南
在sublime text中使用LiveReload插件需要先安装这个插件。具体步骤如下： 1. 打开sublime text，选择菜单中的Preferences -> Package Control。 2. 在弹出的命令面板中输入"Install Package"来搜索包管理器。 3. ...
livereload
11-27
livereload插件，可直接拖到插件拓展页面，Livereload可理解为即时刷新，在前端开发中，开发者在编写或调试html/js/css代码后需要从编辑器切换到浏览器，再刷新浏览器才能看到页面变化，这种十分频繁的操作在一定程度上影响了工作效率，而Liverelod可以帮助我们ad解决了这个问题。
liveReload下载chrome自动刷新插件
12-11
每次调试CSS或HTML后，都需要手动刷新页面看效果，无形中占用了很多的编程时间，介绍无需刷新看效果的方法：livereload
LiveReload谷歌浏览器插件
04-06
LiveReload浏览器插件结合起来的时候，就能够在模板、图片、样式表、JavaScript等（实际上，几乎涵盖为浏览器提供服务的所有内容）发生变化的时候，自动刷新浏览器。
Spring Boot LiveReload 插件使用
泠青沼
03-28 1145
监视页面上的源文件， 更新源文件时重新加载页面或仅重新加载更改的样式表，监视器包括页面上的脚本、样式表和/或框架，以使用可配置的规则进行更改。 重新加载整个页面或仅重新加载已更改的源文件。
livereload的使用
weixin_33890499的博客
05-26 180
2019独角兽企业重金招聘Python工程师标准>>> ...
Livereload介绍
weixin_34247299的博客
04-25 691
Livereload可理解为即时刷新，在前端开发中，开发人员在编写或调试html/js/css代码后须要从编辑器切换到浏览器。再刷新浏览器才干看到页面变化，这样的十分频繁的操作在一定程度上影响了工作效率，而Liverelod能够帮助我们ad攻克了这个问题。 实现livereload有多种方式。能够借助Livereload软件加浏览器插件实现。也能够借助nodejs。通过gulp或者g...
利用LiveReload插件实现vscode和谷歌浏览器实时刷新
老徐的博客只有干货
12-14 1929
说明 最近在研究CSS希望可以提升一个层次。在写DEMO练习的时候老是需要去谷歌浏览器手动刷新页面才能看到更改后的效果次数多了 我也受不了，这不我又请来了个帮手: LiveReload，名如其人，这家伙专门干实时刷新。怎么整？看下面： 实现效果 配置步骤 1.vscode安装LiveRelod 插件处搜索安装即可，不多说。 2.启用LiveReload vscode中按下快捷键ctrl+shift+p搜索配置：live 然后单击第一项，反复单击为启用/禁用 切换。 3.chrome浏览器中安装Li
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值