Sublime text3設定LiveReload插件

angryTom
發布: 2019-10-14 16:34:54
轉載
3365 人瀏覽過

下面由sublime教學#欄位來介紹Sublime Text3 設定安裝livereload外掛方法,希望對需要的朋友有幫助!

Sublime text3設定LiveReload插件

在我們寫前端程式碼時,常規操作是在編輯器寫完程式碼儲存,再到瀏覽器刷新顯示,流程很繁瑣,今天介紹這款sublime text3的插件將提高我們的開發效率,它就是LiveReload。

Tip
LiveReload是很棒的插件,可以在瀏覽器中即時預覽,但是在Sublime text3裡,從Package Control安裝的LiveReload是無法使用的,但可以選擇手動安裝解決。

LiveReload插件下載

#Sublime端

Github上的LiveReload for Sublime text3的位址:https://github.com/Grafikart/ST3-LiveReload,兩種方式安裝:

方法一:

選擇DownloadZip,將解壓縮的資料夾放在Packages資料夾(Preference>Browse Packags)重啟ST3

方法二:

直接clone到Packages資料夾。

//适用于Linux  OSX  
//Windows可以通过Git操作
//进入Packages目录下
rm -rf LiveReload  
git clone https://github.com/Grafikart/ST3-LiveReload.git LiveReload
登入後複製

瀏覽器端

我用的是chrome,在應用程式商店可以直接找到LiveReload,安裝

安裝之後會出現這個圖示。 Sublime text3設定LiveReload插件

配置

1. ctrl+shift+p
2. LiveReload: Enable/disable plugins
3. Enable - SimpleReload
登入後複製

#即時預覽

##把html檔案在瀏覽器中打開,點擊一次圖示中間的圓環變成原點就代表可以即時預覽了。

ST3中的檔案儲存一次,瀏覽器就會刷新一次,即時預覽,很方便!

以上是Sublime text3設定LiveReload插件的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:cnblogs.com
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板