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实现网页的自动刷新

我们在编写前端代码时，写好一部分代码时想要看一看代码的实现效果，每次都要手动刷新会非常麻烦，神器来了，LiveReload插件实现网页的实时刷新，操作方法如下：

最新文章

热门文章