这两天倒腾编辑器,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之自动调节输入文本框的高度

    //自动调节输入文本框的高度 - (void)textViewDidChange:(UITableView *)textView{ float height; if ([[[UIDevice curr ...

  2. Android Fragment使用(二) 嵌套Fragments (Nested Fragments) 的使用及常见错误

    嵌套Fragment的使用及常见错误 嵌套Fragments (Nested Fragments), 是在Fragment内部又添加Fragment. 使用时, 主要要依靠宿主Fragment的 ge ...

  3. 【android 开 发 】 - Android studio 下 NDK Jni 开发 简单例子

    Android 开发了一段时间,一方面 ,感觉不留下点什么.有点对不起自己, 另一方面,好记性不如烂笔头,为了往后可以回头来看看,就当做是笔记,便决定开始写博客.废话不多说 ! 今天想搞一搞 ndk ...

  4. 谈谈yii2-GridView如何实现列表页直接修改数据

    作者:白狼 出处:http://www.manks.top/yii2_gridview_advanced.html 本文版权归作者,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原 ...

  5. MySQL更改数据库数据存储目录

    MySQL数据库默认的数据库文件位于/var/lib/mysql下,有时候由于存储规划等原因,需要更改MySQL数据库的数据存储目录.下文总结整理了实践过程的操作步骤. 1:确认MySQL数据库存储目 ...

  6. 关于一个sql的优化分析

    应用这边新上线了一个查询,正在跑,让我看下状态以及分析下能不能再快点. 如下sql: SELECT x.order_no , order_date+7/24 AS order_date, addres ...

  7. JavaWeb开发环境准备之Linux篇

    01 Linux环境准备 (本文在win10上使用 VMware12 + Ubuntu14.04)   1.JDK安装及相关配置 参考:http://blog.csdn.net/sxdtzhaoxin ...

  8. 安装mysql后的基本配置

    1.添加环境变量 右键 此电脑->属性->高级系统设置->环境变量,在系统变量里面找到Path,双击.点击编辑,将mysql中bin文件的路径添加到最后一行,如:F:\AppSev\ ...

  9. mybatis配置-返回date类型丢失时间

    此博客仅作于平时开发所遇到的问题记录,不做他用,描述可能不好,自己看懂即可~~ resultMap配置返回时间类型时,发现数据库时间是精确到秒的,但是返回给javabean之后丢失时分秒的信息,只有日 ...

  10. WPF 无边框透明按钮

    在实际开发过程中,有时候要设置一个无边框的按钮,或者无边框的透明按钮. 按钮效果如下: 1.当你应用telerik组件中的Button时,这个直接就可以设置 telerik:StyleManager. ...