SublimeText2下的LiveReload在SublimeText3下無法正常使用,本文整理SublimeText3安裝LiveReload的方法。win7下實測可用!
安裝成功后,就不需要再手動去F5刷新頁面了,修改完代碼Ctrl+S,瀏覽器自動刷新,如果是雙屏,效率提升還是比較明顯的。
工具
- Chrome
- Sublime Text 3
- Git
Chrome安裝LiveReload
在Chrome插件中心搜索"reload"並安裝,(https://chrome.google.com/webstore/search/reload?hl=zh-CN),
成功后可以看到地址欄右邊多了一個LiveReload圖標(裝google插件,記得翻個牆)

Sublime3 安裝LiveReload
Sublime3中,直接PackageControl里下載來的LiveReload沒有效果,可以手動從git上下載。
1、打開“Sublime Text 3”點擊菜單欄Preferences->Browse Packages...打開插件安裝目錄;
2、在插件安裝目錄下右擊鼠標選擇“Git Bash Here...”,打開git bash;


3、安裝LiveReload插件,在命令行下輸入
git clone https://github.com/Grafikart/ST3-LiveReload.git LiveReload

4、使用:Ctrl+Shift+P 打開ControlPackage
5、選LiveReload: Enable/disable plug-ins
6、選Enable - SimpleReload
如果不行,就在sublime text3 配置LiveReload。preferences -> Packge Settings -> LiveReload -> Settings - Default。

{ "enabled_plugins": [ "SimpleReloadPlugin", "SimpleRefresh" ] }
實時預覽
1、在web服務器下編輯index.html文件輸入如圖內容,在瀏覽器中輸入http://localhost訪問文件;
2、然后點擊 Chrome瀏覽器右邊的“LiveReload”圖標中間小圓點由虛變實,表示啟動插件;
3、修改index.html文件內容按 ctr+s 保存,即可在chrome里面看到實時更新。

其他
如果之后打開sublime出現錯誤提示框,請看 http://blog.csdn.net/yaerfeng/article/details/9198213
自動刷新網頁的其他方法:
webstorm有liveedit插件可以;(IDE)
brackets也有實時刷新功能;(IDE)
引入live.js可以,但是之后要手動去清除;
