原文鏈接：http://www.itdecent.cn/p/0edcc784f2be
切換到瀏覽器F5刷新，看自己剛寫的代碼有沒(méi)有效果，沒(méi)有效果就再切換到編輯器下修改，然后再切換到瀏覽器F5刷新看效果，還沒(méi)有效果，就再......(F5鍵都被按的塌下去了有木有！)
那么今天就讓我們看看如何使用sublime3和chrome配合，使用livereload插件實(shí)現(xiàn)HTML實(shí)時(shí)預(yù)覽。
主要步驟：
1.在sublime里面安裝livereload插件。
2.在chrome里面安裝livereload插件。
先說(shuō)下sublime3里面安裝livereload過(guò)程：
1a.在sublime里面ctrl+shift+p
2.輸入install package,如下圖
Paste_Image.png
3.搜索livereload,然后點(diǎn)擊安裝，如下圖
Paste_Image.png
安裝成功后會(huì)打開一個(gè)窗口如下圖：
Paste_Image.png
4.配置(2種方法)
法一:
按著這個(gè)路徑將下面的代碼放進(jìn)去
Preference>Package Settings>LiveReload>Settings User
{"enabled_plugins": ["SimpleReloadPlugin","SimpleRefresh"]}
法二：
按著下面步驟操作也可以的
a. ctrl+shift_p
b. LiveReload: Enable/disable plugins
c.Enable - SimpleReload
至此sublime里面我們配置好了，下面我嗎需要在chrome安裝livereload插件
插件下載地址：http://www.cnplugins.com/devtool/livereload/
1.打開chrome瀏覽器，點(diǎn)擊右上角-->設(shè)置-->擴(kuò)展程序，把下載好的livereload插件拖到里面
Paste_Image.png
現(xiàn)在我們就完成了所有安裝，下面看下如何使用（很簡(jiǎn)單的）
使用方法：
安裝完成后，瀏覽器右上角會(huì)多個(gè)小圖標(biāo)，如下圖
Paste_Image.png
1.把你的html用chrome打開
2.點(diǎn)擊右上角的livereload圖標(biāo)，當(dāng)圖標(biāo)中間的空心小圓，變成實(shí)心后，說(shuō)明livereload正常工作
3.在sublime里面隨意修改html，css，js代碼，切換瀏覽后不用刷新就能看到效果了
作者：rain129
鏈接：http://www.itdecent.cn/p/0edcc784f2be
來(lái)源：簡(jiǎn)書
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán)，非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。
