本文所用軟件版本Sublime Text 3(Build 3143)、WebStorm 2017.2.4(Build #WS-172.4155.35)、Google Chrome v61.0.3163.100，其他版本軟件配置過程可能不一樣，請知悉！

一.Google Chrome安裝LiveReload插件

1.下載插件
LiveReload 2.1.0
鏈接：http://pan.baidu.com/s/1bDvsia 密碼：aphx

2.安裝插件
（1）瀏覽器地址欄輸入：chrome://extensions/進入拓展程序
（2）拖拽安裝

鼠標左鍵選中要安裝的插件，拖拽至拓展程序頁面，看到“拖放以安裝”時釋放鼠標，就安裝成功了。（小伙伴留下自己的看法，前面這句要刪掉嗎，我覺得有圖片就夠了）

別忘了打鉤哦

二.Sublime Text 3安裝LiveReload插件

1.安裝Package Control

ctrl+shift+p 打開命令行
輸入Package Control，按下Enter鍵
首次安裝插件需要該步驟，若之前已安裝直接看下一步

2.安裝LiveReload插件
（1）ctrl+shift+p 打開命令行。 輸入install package，按下Enter鍵

（2）輸入LiveReload，按下Enter鍵
（3）安裝成功后，依次點擊Preferences > Package Settings > LiveReload > Settings User（首選項 > Package Settings > LiveReload > Settings User），在設置頁面輸入如下代碼

{"enabled_plugins": ["SimpleReloadPlugin","SimpleRefresh"] }

（4）重啟Sublime Text 3，現在插件就能用了

3.使用LiveReload插件
（1）Google Chrome打開正在編輯的代碼，點擊瀏覽器右上角插件按鈕
→
（2）在Sublime Text 3修改代碼，切換到Google Chrome，你會發現網頁自動刷新了

三.Google Chrome安裝JetBrains IDE Support插件

1.下載插件
JetBrains IDE Support 2.0.7
鏈接：http://pan.baidu.com/s/1bptqJx1 密碼：9sjb

2.安裝插件

請參考本文前面的描述

四.WebStorm使用Live Edit功能

依次點擊File>Setttings，搜索框輸入live edit。在選擇Update>Auto in(ms)，點擊OK保存設置

選中要調試的html文件右鍵選擇Debug，這時Google Chrome會彈出該網頁。在WebStorm里面修改代碼，Google Chrome就可以實時刷新了

注意別點取消，那樣就不能實時刷新了

總結下：Sublime Text3安裝東西要麻煩些，不過安裝好了直接就可以用。而WebStorm雖然安裝方便，不過每次使用都要右鍵Debug比較折騰人。對比下來，我個人更喜歡用Sublime Text3寫代碼！

總結

以上是生活随笔為你收集整理的Sublime Text 3 、WebStorm配置实时刷新的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。