Sublime Text 3结合Chrome实现网页的自动刷新
我们在编写前端代码时,写好一部分代码时想要看一看代码的实现效果,每次都要手动刷新会非常麻烦,神器来了,LiveReload插件实现网页的实时刷新,操作方法如下:
1. 官网下载Sublime Text 3
根据自己的电脑版本选择相应的安装包,这里我选择的是Windows 64-bit,下载完成后默认安装即可
2. 安装Package Control
安装完成后打开Sublime Text 3,使用快捷键Ctrl+` 打开控制台,输入一下代码并回车
import urllib.request,os,hashlib; h = 'df21e130d211cfc94d9b0905775a7c0f' + '1e3d39e33b79698005270310898eea76'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by)
完成后再Preferences下出现Package Control即为安装成功
- 使用Package Control安装插件的方法:
快捷键ctrl+shift+p调出Package Control,输入ip,选择Install Package回车,等待几分钟。
输入要安装的插件名回车即可安装
3.Sublime Text 3安装LiveReload
接上一步,输入LiveReload,回车,等待安装完成
4.谷歌Chrome安装LiveReload插件
打开
Chrome网上应用商店(ps:自己想办法或者网上搜教程),搜索LiveReload,并添加到Chrome
5.添加完成后浏览器右上角会出现一个小圆环,如下:
右键小圆环,选择管理拓展程序,开启允许访问文件网址
6.打开想要实现实时刷新的网页文件,点击右上角小圆环,小圆环中间的校园点变成实心即可
7、Sublime Text 3打开,快捷键Ctrl+shift+p,键入livereload,选择livereload:Enable/disable plug-ins回车即可。
8.在Preferences中选择settings-user,输入以下代码并保存
{"enabled_plugins": ["SimpleReloadPlugin","SimpleRefresh"]}
9.网页源码更新后Ctrl+S保存后,网页会同时刷新,是不是感觉一下子就方便了很多,省时又省力,哈哈哈!!!
Sublime Text 3结合Chrome实现网页的自动刷新的更多相关文章
- sublime text build system automatic ctrl/cmd+B自动选择 python2 或 python3
背景 我同时安装了 python2 和 python3 时,python 指向 python2,python3 才是 python3 默认情况下,在 Sublime 内 Ctrl/Cmd + B 运行 ...
- sublime text 3 ,React,html元素自动补全方法(用Emmet写法写jsx中的html)
1. 安装emmet: Preferences -> Package Control -> Install Package -> emmet 2. 配置emmet: Preferen ...
- 使用chrome开发程序,自动刷新开发目录
npm i livereload -g 在开发目录下: livereload 安装这个插件:https://chrome.google.com/webstore/detail/livereload/j ...
- Sublime3和Chrome配置自动刷新网页【实测可用】
SublimeText2下的LiveReload在SublimeText3下无法正常使用,本文整理SublimeText3安装LiveReload的方法.win7下实测可用! 安装成功后,就不需要再手 ...
- Sublime Text 有哪些使用技巧
1. 更改变量名的几种方法<img src="https://pic4.zhimg.com/d93cf0e8987e0117f3a3187cfe8e53fb_b.jpg&quo ...
- 令人惊叹的sublime text 3 插件
1.ChineseLocalization------语言汉化.(新手必备) 2.SublimeTmpl------打开生成模板.(新手必备) 3.SublimeCodeIntel------代码自 ...
- [转]Sublime Text操作
原文地址:http://www.madongdong.me/sublime-text3%E4%BD%BF%E7%94%A8%E6%8C%87%E5%8D%97/ 作者:马东东 前言(Prologue) ...
- 【Sublime Text】sublime修改默认浏览器及使用不同浏览器打开网页的快捷键设置
#第一步:安装SideBarEnhancements插件 下载插件,需要“翻墙”,故提供一下该插件的github地址:https://github.com/titoBouzout/SideBarEnh ...
- Sublime Text 3 全程详细图文原创教程(持续更新中。。。)
一. 前言 使用Sublime Text 也有几个年头了,版本也从2升级到3了,但犹如寒天饮冰水,冷暖尽自知.最初也是不知道从何下手,满世界地查找资料,但能查阅到的资料,苦于它们的零碎.片面,不够系统 ...
随机推荐
- C语言中的字节对齐
下面这个篇博客讲解很好 http://blog.csdn.net/meegomeego/article/details/9393783 总的来看分三类: 1. 不加 #pragma pack(n)伪指 ...
- IDEA高颜值之最吸引小姐姐插件集合!让你成为人群中最靓的那个崽!
经常有小伙伴会来找TJ君,可能觉得TJ君比较靠谱,要TJ君帮忙介绍女朋友.TJ君一直觉得程序猿是天底下最可爱的一个群体,只不过有时候不善于表达自己的优秀,所以TJ君今天准备介绍几款酷炫实用的IDEA插 ...
- 谈谈你对volatile的理解
1.volatile是Java虚拟机提供的轻量级的同步机制 1.1保证可见性1.2不保证原子性1.3禁止指令重排 JMM(Java内存模型Java Memory Model,简称JMM)本身是一种抽象 ...
- 容器之分类与各种测试(四)——unordered-multiset
unordered-multiset是不定序关联式容器,其底部是通过哈希表实现功能. (ps:黑色框就是bucket,白色框即为bucket上挂载的元素) 为了提高查找效率,bucket(篮子)的数量 ...
- android:为TextView添加样式、跑马灯、TextSwitcher和ImageSwitcher实现平滑过渡
一.样式 设置下划线: textView.getPaint().setFlags(Paint.UNDERLINE_TEXT_FLAG);//下划线 textView.getPaint().setAnt ...
- 【面试】【Linux】【Web】基础概念
1. HTTP https://en.wikipedia.org/wiki/Hypertext_Transfer_Protocol 2. TCP handshake https://en.wikipe ...
- 【Linux】【Services】【Docker】基础理论
1. 名称空间:NameSpace 内核级别,环境隔离: 1.1. 名称空间的历史 PID NameSpace:Linux 2.6.24 ,PID隔离 Network NameSpace:Linux ...
- 南邮CTF-MISC-Remove Boyfriend
Remove Boyfriend 打开wireshark,找到关键字部分Remove Boyfriend 在第五行 在此行右击 点击追踪流 选择TCP流,可以分析出流量的传输过程 通过上面的执行列表 ...
- python数据预处理和特性选择后列的映射
我们在用python进行机器学习建模时,首先需要对数据进行预处理然后进行特征工程,在这些过程中,数据的格式可能会发生变化,前几天我遇到过的问题就是: 对数据进行标准化.归一化.方差过滤的时候数据都从D ...
- Nginx区分搜索引擎
目录 一.简介 二.配置 一.简介 场景: 当从百度点进来显示中文页面,而谷歌显示英文界面. 原理: 根据referer头来判断 二.配置 这样配置以后,凡是从百度或者google点过来的请求都会跳转 ...