美文网首页工具工具癖程序员
Sublime Text 3 配置Live​Reload实时刷新

Sublime Text 3 配置Live​Reload实时刷新

作者: Koala_0 | 来源:发表于2016-04-08 11:51 被阅读5939次

    LiveReload是一款非常棒的插件,可以在浏览器中实时刷新页面,这样就可以做到保存就能立马看到效果。想想用着两块屏幕开发时的场景,可以做到实时刷新,再也不用F5。

    准备工作


    开始之前我们需要准备下面这两个插件

    1、下载Sublime Text 3这款编辑器,然后在Sublime安装LiveReload插件。

    2、在Chrome浏览器安装LiveReload插件。

    安装插件


    在Sublime安装LiveReload插件时需要注意下,通过Package Control: Install Package安装的发现后来不能用。所以通过Github下载LiveReload

    LiveReload

    然后在Sublime工具栏Preferences > Browser Packages...打开Packages目录,解压下载的插件到Packages目录并重命名为LiveReload。

    接着安装Chrome上的LiveReload,安装好以后可以在地址栏旁边看到如下按钮。

    未开启监听

    接着右键单击选择管理扩展程序,把允许访问网址文件这一选项勾选上。

    勾选允许访问网址文件

    在Sublime中配置LiveReload


    方法1:过用户自定义配置来开启。

    Preferences > Package Settings > LiveReload > Settings User

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

    方法2:通过控制台命令来开启。

    1. Ctrl+Shift+P

    2. LiveReload: Enable/disableplugins

    3. Enable - Simple Reload

    完成配置后打开一个静态HTML文件,并点击浏览器地址栏旁边的LiveReload按钮,这时看到按钮变成实心的了。

    已经开始监听

    接着修改一下HTML内容就能实时看到效果了。

    相关文章

      网友评论

      本文标题:Sublime Text 3 配置Live​Reload实时刷新

      本文链接:https://www.haomeiwen.com/subject/qwsvlttx.html