Tip

LiveReload是很棒的插件,可以在浏览器中实时预览,但是在Sublime text3里,从Package Control中安装的LiveReload是无法使用的,但是可以选择手动安装解决。


LiveReload插件下载

Sublime端

Github上的LiveReload for Sublime text3的地址:LiveReload,两种方式安装:

方法一:

选择DownloadZip,将解压的文件夹放在Packages文件夹(Preference>Browse Packags)重启ST3

方法二:

直接clone到Packages文件夹。


//适用于Linux OSX //Windows可以通过Git操作 //进入Packages目录下 rm -rf LiveReload
git clone https://github.com/Grafikart/ST3-LiveReload.git LiveReload

浏览器端

我用的是chrom,在应用商店可以直接找到LiveReload,安装。

安装之后会出现这个图标。

配置

1. ctrl+shift+p
2. LiveReload: Enable/disable plugins
3. Enable - SimpleReload

实时预览

把html文件在浏览器中打开,点击一次图标中间的圆环变成原点就代表可以实时预览了。

ST3中的文件保存一次,浏览器就会刷新一次,实时预览,很方便!

参考:

http://chedanji.com/sublime-text3-livereload/

http://stackoverflow.com/questions/25886011/how-do-i-install-livereload-sublime-text-3


Sublime text3配置LiveReload的更多相关文章

  1. Sublime text3配置LiveReload 浏览器即时刷新

    1.在sublime控件台 install livereload插件(缺点:每次重新打开Sublime都需要启动) 2.配置Preference > Package Settings > ...

  2. 【前端】Sublime text3 插件LiveReload 实现实时预览

    1.首先要安装插件LiveReload Sublime text3. 菜单 preferences->packages control,输入install.. 回车,输入LiveReload回车 ...

  3. Sublime text3 插件LiveReload 实现实时预览

    1.首先要安装插件LiveReload Sublime text3. 菜单 preferences->packages control,输入install.. 回车,输入LiveReload回车 ...

  4. Sublime Text3配置Lua运行环境

    Sublime Text3配置Lua运行环境 前言 要问现在哪个编译器最能扛得住潮流,要数Sublime Text3了,由于它的轻量,插件丰富,美观,造就了一大批粉丝(本菜鸡也是哦) 在以前的工作中使 ...

  5. MAC系统下Sublime Text3 配置Python3详细教程

    MAC系统下Sublime Text3 配置Python3详细教程(亲测有效) https://blog.csdn.net/weixin_41768008/article/details/798590 ...

  6. Sublime Text3 配置Python3编译环境

    Sublime Text3 配置Python编译环境 进入Sublime Text3 ,然后选择菜单:工具(T)==>编译系统(U)==>新编译系统... 把上面的代码换成如下代码: &q ...

  7. Sublime Text3 配置 NodeJs 环境

    前言 大家都知道,Sublime Text 安装插件一般从 Package Control 中直接安装即可,当我安装 node js 插件时候,直接通过Package Control 安装,虽然插件安 ...

  8. sublime Text3配置及快捷键、插件推荐总结

    一.基础 1.重要文档: sublime Text3官方文档中文版:http://feliving.github.io/Sublime-Text-3-Documentation/ sublime Te ...

  9. sublime text3 配置使用

    前言 sublime text3 是一款优秀的代码编辑器,很多好用的功能让我成为其忠实用户. 流程 1.安装完成后首先配置package control,把下面的代码复制到sublime 的控制台: ...

随机推荐

  1. Java基础知识强化36:StringBuffer类之StringBuffer的概述

    1. StringBuffer类概述: (1)String的缺陷: 我们如果对字符串进行拼接操作,每次拼接,都会构造一个新的String对象,既耗时,又浪费空间.如下图: (2)StringBuffe ...

  2. ls 命令详解

    1.ls基本语法及选项 用法:ls [选项]... [文件]... List information about the FILEs (the current directory by default ...

  3. WPF控件---Border应用

    内容模型:Border 只能具有一个子元素.若要显示多个子元素, 需要将一个容器元素放置在父元素Border中. <Grid> <Border BorderBrush="B ...

  4. Android material design support library -- CollapsingToolbarLayout简介

    本文是codetrick上material design support library教程的第三篇,主要讲的是CollapsingToolbarLayout的概念和应用方法. 原文链接:Materi ...

  5. jQuery Scroll div滚动条样式更改

    <script type="text/javascript" src="js/jquery-1.2.6.min.js"></script> ...

  6. CSS3控制元素排列

    需求: 将改变为. 代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset=& ...

  7. HTML&CSS基础学习笔记1.3-HTML的标签语法

    HTML标签语法 1. 标签由英文尖括号<和>括起来,如<html>就是一个标签. 2. HTML中的标签一般都是成对出现的,分开始标签和结束标签.结束标签比开始标签多了一个/ ...

  8. C程序设计语言练习题1-9

    练习1-9 编写一个将输入复制到输出的程序,并将其中连续的多个空格用一个空格代替. 代码如下: #include <stdio.h> // 包含标准库的信息. int main() // ...

  9. c语言,全局变量,局部变量,外部函数,内部函数,stasic和extern的复习总结

    @import url(http://i.cnblogs.com/Load.ashx?type=style&file=SyntaxHighlighter.css);@import url(/c ...

  10. 【南阳OJ分类之语言入门】80题题目+AC代码汇总

    小技巧:本文之前由csdn自动生成了一个目录,不必下拉一个一个去找,可通过目录标题直接定位. 本文转载自本人的csdn博客,复制过来的,排版就不弄了,欢迎转载. 声明: 题目部分皆为南阳OJ题目. 代 ...