需要插件 
sublime text3：View in Browser；LiveReload

chrome：liveReload

配置方法

一：sublime text3

sublime 3下载地址：

http://download.csdn.net/download/reggergdsg/9541966

1、在sublime text3安装插件 view in browser

注意（安装插件之前先安装Package Control： 
http://blog.csdn.net/weixin_36401046/article/details/52880000， 
http://devework.com/sublime-text-3-package-control.html）

ctrl+shift+p
  • 1
  • 1
输入install package回车
  • 1
  • 1

view in browser
  • 1
  • 1

2、安装成功后，修改默认的浏览器：

preferences->package setting->view in browser->setting default
  • 1
  • 1

把firefox改为chrome64

3、在sublime text3安装插件liveReload

ctrl+shift+p
  • 1
  • 1
输入install package回车
  • 1
  • 1
liveReload
  • 1
  • 1

4、liveReload配置

preferences -> Packge Settings -> LiveReload -> Settings - Default
  • 1
  • 1

输入以下内容保存即可

{

    "enabled_plugins": [

        "SimpleReloadPlugin",

        "SimpleRefresh"

    ]

}
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6

二、 chrome浏览器安装liveReload插件

1、

方法一：进入chrome插件中心，搜索liveReload，安装即可。
  • 1
  • 1

方法二：如果进不到插件中心，下载安装包安装到chrome浏览器：
  • 1
  • 1

http://download.csdn.net/download/weixin_36401046/9659158

2、进入chrome扩展程序页面，将livereload中的允许访问文件网址打上勾

三、测试 
重新打开sublime text3，重新启动chrome。 
在sublime text3编辑一个测试html文件，

<html>

<meta charset="UTF-8">

<body>

<h1>开心</h1>

<p>自动刷新</p>

</body>

</html>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7

按 ctr+alt+v 在chrome浏览器中运行，编辑器下方出现livereload提示，并且点击chrome浏览器的livereload图标中间小圆点由虚变实，说明配置成功。

重点内容：只需要在sublime text3里编辑代码，按 ctr+s 保存，即可在chrome里面看到实时更新。

如果没有成功自动刷新，把以下走一遍：

1、找到packages文件夹

2、从https://github.com/Grafikart/ST3-LiveReload 下载压缩包到本地

3、解压， 重命名为LiveReload，拷贝到packages中

参考文献：http://blog.csdn.net/neet007/article/details/51694643

前端可视化编程：liveReload安装，sublime 3的更多相关文章

  1. java可视化编程-eclipse安装windowbuilder插件(转载)

    原文地址:http://blog.csdn.net/jason0539/article/details/21219043 一直做在安卓用xml作界面,对于java的控件不熟悉,也不习惯用代码做UI尤其 ...

  2. 前端可视化开发-livereload

    在前端开发中,我们会频繁的修改html.css.js,然后刷新页面,开效果,再调整,再刷新,不知不觉会浪费掉我们很多时间.有没有什么方法,我在编辑器里面改了代码以后,只要保存,浏览器就能实时刷新.经过 ...

  3. 重磅：前端 MVVM 与 FRP 的升阶实践 —— ReRest 可视化编程

    ReRest (Reactive Resource State Transfer) 是前端开发领域新兴的方法论体系,它继承了 MVVM 与 FRP 编程理念,在技术上有不少创新.本文从专利稿修改而来, ...

  4. 【编程工具】Sublime Text3的安装和常用插件推荐

    本人刚刚学习 HTML,曾经上网找过一些编写 HTML 的软件,但感觉都不太好,经过三挑四选下,最终我决定选择 Sublime Text3 这款软件来作为学习工具,上网找到了许多实用的插件,在这里给大 ...

  5. Atitit.可视化编程jbpm6 的环境and 使用总结...

    Atitit.可视化编程jbpm6 的环境and 使用总结... 1. Jbpm的意义 1 2. Jbpm6环境配置 2 2.1. Down 2 2.2. Install eclipse jbpm p ...

  6. 前端自动化神器LiveReload配合浏览器和less/sass使用方法

    前言:搜了半天,各种推荐,什么十大工具啦.优秀工具集合啦之类的咸淡文章,就是没有一个讲怎么弄的.配合官网的article自己研究了半天总算配置好了.顺便吐槽下官网关于sass/less设置这块说的模糊 ...

  7. ubuntu安装sublime教程

    1.安装Sublime Text 3 及常用的神器插件 ①首先添加sublime text 3的仓库:sudo add-apt-repository ppa:webupd8team/sublime-t ...

  8. Python数据可视化编程实战pdf

    Python数据可视化编程实战(高清版)PDF 百度网盘 链接:https://pan.baidu.com/s/1vAvKwCry4P4QeofW-RqZ_A 提取码:9pcd 复制这段内容后打开百度 ...

  9. [转]Centos 安装Sublime text 3

    本文简单介绍在CentOS上安装Sublime text 3, 转自:Centos 安装Sublime text 3 Step 1 :建立软件安装目录 # mkdir /opt # cd /opt S ...

随机推荐

  1. 腾讯云CentOS 安装 Hadoop 2.7.3

    1.安装 jdk yum install java 2.安装maven wget http://mirrors.hust.edu.cn/apache/maven/maven-3/3.5.0/binar ...

  2. c++------------提取文件中的信息

    对于文件比较复杂的时候,为了获取文件中的信息,需要一些比较特殊的函数,比如,getline().replace().atoi,atof等 例子一,读取以下文件中的数据,并保存进一个类里面. 首先,类的 ...

  3. Java编程的逻辑 (29) - 剖析String

    ​本系列文章经补充和完善,已修订整理成书<Java编程的逻辑>,由机械工业出版社华章分社出版,于2018年1月上市热销,读者好评如潮!各大网店和书店有售,欢迎购买,京东自营链接:http: ...

  4. webbrowser取页面验证码

    碰到一个无比坑爹,外加蛋疼乳酸的问题.从昨天晚上发现bug,到今天下午解决问题,搞了大半天的时间.光是找问题就花了半天,解决问题的方法简单,但是方案的形成也是无比纠结的过程. 背景:webbrowse ...

  5. Android开发，在Fragment中，隐藏或关闭软键盘（虚拟键盘）的方法

    网上可以搜到各种方法,实际测试中,我的开发用机中,仅仅下面这个方法有效,记录一下. //隐藏虚拟键盘      public static void HideKeyboard(View v)      ...

  6. name是个特殊的变量名吗

    这是为什么?求大神

  7. ELASTICSEARCH 中暂时移除一个节点

    ELASTICSEARCH 中暂时移除一个节点 版权声明 本站原创文章 由 萌叔 发表 转载请注明 萌叔 | http://vearne.cc 前言 在维护ES集群的过程中,我们会经常遇到将某个ES实 ...

  8. 《C++程序设计教程——给予Visual Studio 2008》读书笔记1,2章

    double *p1;       //p1为指向double型的指针变量 POINT *p2;       //p2为指向POINT型(点类型)的指针变量 int (*p3)[6];     //p ...

  9. PHP和MySQL实现消息队列

    最近遇到一个批量发送短信的需求,短信接口是第三方提供的.刚开始想到,获取到手机号之后,循环调用接口发送不就可以了吗? 但很快发现问题:当短信数量很大时,不仅耗时,而且成功率很低. 于是想到,用PHP和 ...

  10. Navi.Soft31.WinForm框架(含下载地址)

    1概述 1.1应用场景 尽管互联网高速发展,互联网软件也随之越来越多,但桌面应用程序在某些领域中还是不可替代,如MIS,ERP,CRM等软件产品,同时,这类软件均包括一些通用的功能,如:与数据库操作, ...