[Tools]LiveReload使用於Windows上

對一位前端工程師或是網頁設計師來說,一邊改HTML一邊按F5重整網頁是每天最常做的事情
推薦一個好用軟體幫大家節省按F5的時間,只要按下儲存他就會馬上自動更新
那就是LiveReload

一、安裝
首先到官網http://livereload.com/下載Windows的最新版本,

Try LiveReload 0.8.5.1 Alpha

接下來安裝就對了

二、如何使用

安裝完畢後,可從程式及裡面打開它,接下來選擇Add也就是選擇你的HTML放置的目錄位置,

比如說我放在C:\inetpub\wwwroot\LiveReloadTest

接下來安裝browser extensions或是照他上面給的script加入載

前面

這裡我使用的是Chrome

https://chrome.google.com/webstore/detail/livereload/jnihajbhpnppcggbcgedagnkighmdlei

安裝完畢後瀏覽器會有一個新的按鈕

按鈕如果是實心狀態表示啟動,空心則為關閉

接下來我們可以開始進入操作

首先打開瀏覽器將我們的網頁開啟,並開啟編輯工具

注意一點是我是把網頁放在IIS裡面

所以我試過直接打開檔案的方式,按鈕是無法啟用的

我直接打localhost/LiveReloadTest/Index.html的方式按鈕才可以啟用

如果要使用開啟檔案的方式瀏覽網頁,請把2裡面的Script加到Body

前面,一樣可以使用

希望大家看得懂...