这两天倒腾编辑器,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. CocoaPods的使用及安装

    本文转自:http://www.jianshu.com/p/6e5c0f78200a 一.什么是CocoaPods CocoaPods是iOS项目的依赖管理工具,该项目源码在Github上管理.开发i ...

  2. 敏捷开发与jira

    项目背景 项目是基于一套公司自主研发的平台做企业信息化的项目管理业务,经过两个里程碑的交付,已经在客户现场使用,每次版本都能按期交付,延迟较少,客户满意度也高. 项目开发过程采用的敏捷的方法,用类Sc ...

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

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

  4. 如何查看Windows服务器运行了多长时间

    前言:有时候管理.维护Windows服务器需要定期重启服务器(为什么需要重启,你懂的),但是这个"定期"有时候会受很多因素影响,例如某台服务器忘了重启:某台服务器那个时间段业务繁忙 ...

  5. jquery打造自定义控件(原创)

    本人第一次发表文章,不足之出请大家多多包涵 下面是一个combox的代码 /// <reference path="../Js/jquery-1.7.2.min.js" /& ...

  6. ligerDialog的使用

    1.通过ViewBag来传值. @if (ViewBag.ReturnMessage != null) 2.脚本代码: 对话框设计与赋值问题. <script type="text/j ...

  7. Windows 64位下装Oracle 11g,PLSQL Developer的配置问题,数据库处显示为空白的解决方案

    安装pl sql 后,若下图的数据库处为空.则需要安装32位的客户端,说明pl sql不支持64位客户端连接. 解决办法:  1.下载32位Oracle客户端,并安装 2.设置PLSQL Develo ...

  8. java 版本EChart使用

    一.简介 EChart是百度开发的js图表软件,用它我们可以很方便地以图形化的方式对数据进行分析统计.该种方式js在页面动态拼接json数据,再进行渲染.这种方法的优点是,灵活,可以随时进行修改.缺点 ...

  9. 3. Python 简介

    3. Python 简介 下面的例子中,输入和输出分别由大于号和句号提示符 ( >>> 和 ... ) 标注:如果想重现这些例子,就要在解释器的提示符后,输入 (提示符后面的) 那些 ...

  10. 转载:SqlServer数据库性能优化详解

    本文转载自:http://blog.csdn.net/andylaudotnet/article/details/1763573 性能调节的目的是通过将网络流通.磁盘 I/O 和 CPU 时间减到最小 ...