sublime3安装liveload,实现前端自动F5刷新html界面
这两天倒腾编辑器,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界面的更多相关文章
- Jenkins 实现前端自动打包,自动部署代码及邮件提醒功能
在之前的公司,我们前端使用webpack构建项目,项目构建完成后,我们会使用ftp或linux的一些命令工具上传我们的文件到服务器上,这种方式虽然是可以,但是最近面试的时候,人家会问我前端如何部署项目 ...
- 学习安装并配置前端自动化工具Gulp
Gulp和所有Gulp插件都是基于nodeJs来运行的,因此在你的电脑上需要安装nodeJs,安装过程请移驾安装并配置前端自动化工具--grunt.安装完成后,通过运行cmd进入DOS命令窗口,如图: ...
- 解决Silverlight F5刷新问题
最近在做一个SL的项目,做完后,遇到一个F5刷新的问题,本人也是第一次接触接触SL项目,记得再ASP.NET浏览器的缓存会自动保存最后一次的浏览记录的. 所以就在网上到处找资料,可惜运气不好,都没找到 ...
- 解决Vuex持久化插件-在F5刷新页面后数据不见的问题
页面刷新后,想保存页面未保存的数据.我们总是习惯于放在浏览器的sessionStorage和localStorage中.但是用了vue后,vuex便可以被应用了. vuex优势:相比sessionSt ...
- sublime3 安装markdown插件
sublime3 安装markdown插件 第一步安装package control 自动安装package control 手动安装package control 安装具体的markdown相关的p ...
- websocket实现数据库更新时前端页面实时刷新
websocket实现数据库更新时前端页面实时刷新 javaweb 目录(?)[+] userjsp ManagerServletjava 如题,实现以上功能,我知道主要有两大种思路: 轮询:轮询的原 ...
- jQuery禁用快捷键例如禁用F5刷新 禁用右键菜单等
禁用鼠标右键菜单栏 $("body").bind("contextmenu", function(event) { return false; }); 禁用快捷 ...
- C# webbrowser实现真正意义上的F5刷新
关于webbrowser的刷新在C#中有提供方便的方法: webbrowser.refresh(); 但是有时候会发现,不给力啊 那怎么办? 还有一招: webBrowser1.Document.Ex ...
- 在浏览器地址栏按回车、F5、Ctrl+F5刷新网页的区别
不少同学问,不都是刷新吗?还有什么区别?其实,还是有的. 其中,在地址栏按回车又分为两种情况.一是请求的URI在浏览器缓存中未过期,此时,使用Firefox的firebug插件在浏览器里显示的HTTP ...
随机推荐
- IOS开发基础知识--碎片40
1:Masonry快速查看报错小技巧 self.statusLabel = [UILabel new]; [self.contentView addSubview:self.statusLabel]; ...
- iOS开发之功能模块--高仿Boss直聘的IM界面交互功能
本人公司项目属于社交类,高仿Boss直聘早期的版本,现在Boss直聘界面风格,交互风格都不如Boss直聘以前版本的好看. 本人通过iPhone模拟器和本人真机对聊,将完成的交互功能通过Mac截屏模拟器 ...
- 47个过程(PMBOK2008)
项目管理过程 知识领域 过程组 含义 之前应完成 之后要进行 制定项目章程 整合 启动 编写一份正式批准项目并授权项目经理使用组织资源的文件的过程 无 制定项目管理计划 制定项目管理计划 整合 规划 ...
- leveldb源码分析--SSTable之Compaction
对于compaction是leveldb中体量最大的一部分,也应该是最为复杂的部分,为了便于理解我们首先从一些基本的概念开始.下面是一些从doc/impl.html中翻译和整理的内容: Level 0 ...
- 完全卸载oracle11g步骤
完全卸载oracle11g步骤:1. 开始->设置->控制面板->管理工具->服务 停止所有Oracle服务.2. 开始->程序->Oracle - OraHome ...
- [转]一种简单的js时间控件
使用方法: 粘贴代码到文本文档中,文档名称为datetime.js,然后在html文件中引用如下代码即可 <input name="shijian1" id="sh ...
- 帆软报表FineReport中数据连接的JDBC连接池属性问题
连接池原理 在帆软报表FineReport中,连接池主要由三部分组成:连接池的建立.连接池中连接使用的治理.连接池的关闭.下面就着重讨论这三部分及连接池的配置问题. 1. 连接池原理 连接池技术的核心 ...
- documentbodyscrollTop的值总为零的解决办法
有一个功能需要判断返回顶部按钮是否显示. JS代码如下: var sTop = document.body.scrollTop; if(sTop>100){ document.getElemen ...
- markdown编辑器
经过一番探索终于找到两个可以实时预览的markdown编辑器 一,sublime text 3 + MarkDown Editing + OmniMarkupPreviwer 安装方法网上均有,这里要 ...
- BZOJ 2330: [SCOI2011]糖果 [差分约束系统] 【学习笔记】
2330: [SCOI2011]糖果 Time Limit: 10 Sec Memory Limit: 128 MBSubmit: 5395 Solved: 1750[Submit][Status ...