Sublime Text 3 LiveReload

Sublime Text 3 LiveReload

 

之前有介紹過 Windows LiveReload 開發環境

當時是使用 Sublime Text 2 建置環境，但是還是有很多錯誤

最近因為在嘗試把 Theme 加上 RWD 功能，所以需要存檔馬上更新頁面的功能

先前都是用 Sublime Text 3 加 SFTP 存檔上傳的方法做…

但是存檔完之後還是要手動更新頁面，無法做到即時性的更新

所以最近開始萌生念頭，也找了許多資料…最後測試成功了 !!

所需軟體如下:
1.Sublime Text 3 (軟體名稱)
2.Sublime Text 3 – LiveReload (軟體外掛)
3.AMPPS (伺服器環境架設)
4.Chrome – LiveReload (瀏覽器附加元件)

準備好以上就可以開始實作了!!

1. AMPPS 啟動，保持 Start 狀態 !! 也要確定 php 可以運行

2.Chrome 安裝 LiveReload 附加元件

3.Sublime Text 3 安裝 LiveReload 外掛

4.在 Sublime Text 3 –> Preferences –> Package Settings –> LiveReload –> Settings – Default

輸入以下字串

[code lang=”php”]{
"enabled_plugins": [
"SimpleReloadPlugin",
"SimpleRefresh"
]
} [/code]

當今天打開 Chrome 時如下圖所示

圖左空心表示關閉狀態，存檔不會自動更新。

圖右實心表示啟用狀態，存檔時會自動更新。

 

實作畫面