Sublime Text3搭配LiveReload实现前端实时刷新页面

大前端/ 软件大前端

创建时间:2019-09-07 15:08

字数:290 阅读:

评论:

一、下载安装插件LiveReload
二、添加完后在扩展程序页面，点击LiveReload的详细信息，打开【允许访问文件网址】
三、Sublime Text3下载LiveReload
四、配置并启用LiveReload
五、使用

介绍：

LiveReload是一款连接编辑器与浏览器解放F5的开发工具。LiveReload会监视文件系统的变化，一旦你保存文件，它就自动将浏览器刷新。所以当你改变保存一个CSS文件或图像，浏览器是即时刷新页面，无需你手动点击F5刷新。

一、下载安装插件LiveReload

在Chrome应用商店下载插件LiveReload，点击添加到Chrome后在菜单栏中显示一个有着空心圆的图标。
LiveReload下载链接

二、添加完后在扩展程序页面，点击LiveReload的详细信息，打开【允许访问文件网址】

三、Sublime Text3下载LiveReload

通过在Sublime Text3中：Ctrl+Shift+P→ install Package→livereload

四、配置并启用LiveReload

配置LiveReload

Preference>Package Settings>LiveReload>Settings User，复制下面的代码粘贴保存
{"enabled_plugins": ["SimpleReloadPlugin","SimpleRefresh"]}
有些安装插件后Settings User中会有此代码

五、使用

点击 Chrome菜单栏中LiveReload 图标，中心的空心小圆圈
会变成实心
，表示已经启用LiveReload并连接成功。Sublime text3中的任何变化，Ctrl+S后，立即在Chrome中看到相应变化。

转载请注明来源，欢迎对文章中的引用来源进行考证，欢迎指出任何有错误或不够清晰的表达。可以在下面评论区评论，也可以邮件至 541143263@qq.com