这两天倒腾编辑器,atom实在太大了,还是sublime好用

  以前一直用sublime2, 然后更新到sublime3, 然后把一些必要的插件安装了一下:liveload(自动刷新);

  package control

  首先给sublime添加了一个package control的插件, sublime2和sublime3安装package control 的方式不同, 查看这里;

  安装LiveReload

  然后通过快捷键(ctrl+shift+p), 会出现下面这个界面:选择 package control : install package :

    

  sublime会卡一下:然后又会跳出另外一个输入框,在输入框中输入:liveReload, 然后点击过滤出来的选项, 点击机会安装livereload;

    

  livereload安装完毕以后会跳出一个安装完毕的界面。

  enable plugins

  接着再选择Preferences->package setting->LiveReload->Plugins->enable/disable plugins ,启动LiveReload, 然后重新启动sublime;

  浏览器安装LiveReload插件:

  打开google-chrome的应用中心,搜索LiveReload, 并把应用添加到chrome:

    

  允许访问文件网址

  安装完毕以后,打开扩展程序中心, 把LiveReload的允许访问文件网址选项加上:

  

  此时sublime和chrome浏览器插件都安装好了。

  最后一步, 启用插件

  最后一步是通过sulime选择在浏览器中打开html文件, 然后再点击浏览器上的插件按钮

  此时按钮会变成实心的:

  

  如果查看网页源码,会发现网页源码下被添加了一个script标签:

  现在,只要我们修改对应的html文件并ctrl+s保存文件, 对应的浏览器界面会自动刷新;

作者: NONO
出处:http://www.cnblogs.com/diligenceday/

QQ:287101329

微信:18101055830

sublime3安装liveload,实现前端自动F5刷新html界面的更多相关文章

  1. Jenkins 实现前端自动打包,自动部署代码及邮件提醒功能

    在之前的公司,我们前端使用webpack构建项目,项目构建完成后,我们会使用ftp或linux的一些命令工具上传我们的文件到服务器上,这种方式虽然是可以,但是最近面试的时候,人家会问我前端如何部署项目 ...

  2. 学习安装并配置前端自动化工具Gulp

    Gulp和所有Gulp插件都是基于nodeJs来运行的,因此在你的电脑上需要安装nodeJs,安装过程请移驾安装并配置前端自动化工具--grunt.安装完成后,通过运行cmd进入DOS命令窗口,如图: ...

  3. 解决Silverlight F5刷新问题

    最近在做一个SL的项目,做完后,遇到一个F5刷新的问题,本人也是第一次接触接触SL项目,记得再ASP.NET浏览器的缓存会自动保存最后一次的浏览记录的. 所以就在网上到处找资料,可惜运气不好,都没找到 ...

  4. 解决Vuex持久化插件-在F5刷新页面后数据不见的问题

    页面刷新后,想保存页面未保存的数据.我们总是习惯于放在浏览器的sessionStorage和localStorage中.但是用了vue后,vuex便可以被应用了. vuex优势:相比sessionSt ...

  5. sublime3 安装markdown插件

    sublime3 安装markdown插件 第一步安装package control 自动安装package control 手动安装package control 安装具体的markdown相关的p ...

  6. websocket实现数据库更新时前端页面实时刷新

    websocket实现数据库更新时前端页面实时刷新 javaweb 目录(?)[+] userjsp ManagerServletjava 如题,实现以上功能,我知道主要有两大种思路: 轮询:轮询的原 ...

  7. jQuery禁用快捷键例如禁用F5刷新 禁用右键菜单等

    禁用鼠标右键菜单栏 $("body").bind("contextmenu", function(event) { return false; }); 禁用快捷 ...

  8. C# webbrowser实现真正意义上的F5刷新

    关于webbrowser的刷新在C#中有提供方便的方法: webbrowser.refresh(); 但是有时候会发现,不给力啊 那怎么办? 还有一招: webBrowser1.Document.Ex ...

  9. 在浏览器地址栏按回车、F5、Ctrl+F5刷新网页的区别

    不少同学问,不都是刷新吗?还有什么区别?其实,还是有的. 其中,在地址栏按回车又分为两种情况.一是请求的URI在浏览器缓存中未过期,此时,使用Firefox的firebug插件在浏览器里显示的HTTP ...

随机推荐

  1. iOS之2016面试题三

    1.OC内存管理机制 1).当你使用new,alloc和copy方法创建一个对象时,该对象的保留计数器值为 1.当你不再使用该对象时,你要负责向该对象发送一条release或autorelease消息 ...

  2. 两种方法设置disabled属性

    //两种方法设置disabled属性 $('#fileup').attr("disabled",true); $('#fileup').attr("disabled&qu ...

  3. 谈谈Fragment中的onActivityResult

    大家或许有遇到这个神坑,在Fragment中使用startActivityForResult能够成功,可是在Fragment中的onActivityResult却无法被调用.一不注意就让人一夜愁白了头 ...

  4. Android Touch事件分发机制学习

    Android  事件分发机制 ViewGroup dispatchTouchEvent 返回true dispatchTouchEvent: Activity ACTION_DOWN Myrelat ...

  5. IOS基础之UILineBreakModeWordWrap

    UILineBreakModeWordWrap详细解释如下:  typedef enum {     UILineBreakModeWordWrap = 0,     UILineBreakModeC ...

  6. Mybatis基于注解的方式访问数据库

    1. 使用方式:在Service层直接调用 package com.disappearwind.service; import org.springframework.beans.factory.an ...

  7. 如何查看Oracle客户端版本

    在实际工作中,总会遇到一些需要查看.验证ORACLE客户端版本的问题,因为一台服务器可能装了多个Oracle客户端版本:也有可能你需要知道安装的版本是32位还是64位的.如何查看Oracle客户端(O ...

  8. Linux AVG ANTIVIRUS FREE使用介绍

    杀毒软件AVG,没有用过估计也有所耳闻.AVG ANTIVIRUS FREE - FOR LINUX 是AVG在Linux下的一款免费杀毒软件.它的官方下载地址供了rpm.deb.源码安装包等多种安装 ...

  9. Excel画的图复制到Word中变形的解决办法

    在Excel里画好了图,复制到Word里面经常会变形变的一塌糊涂,面目全非,实在是不理解微软为什么要把自己家的软件搞成这样. 要想保持形状不变,需要这样做: 1. 在Excel里面复制图形,和往常一样 ...

  10. jstorm集群部署

    jstorm集群部署下载 Install JStorm Take jstorm-0.9.6.zip as an example unzip jstorm-0.9.6.1.zip vi ~/.bashr ...