VSCode設置網頁代碼實時預覽

1、設置描述
    1.VSCode做爲一款很不錯的開發軟件，相比DW更小巧，用來測試前端特別不錯，那麼咱們平時開發網頁發現只有寫完代碼，而後保存，接下來到瀏覽器中刷新查看效果，而後不停重複，咱們發現不少時間就這樣浪費到了這三個步驟上。

    2.其實咱們能夠在VSCode中配置一個網頁服務器，修改完代碼以後只須要保存代碼瀏覽器就能夠實時預覽

2、操做步驟
    1.打開VScode，點擊座標工具欄的最後一個進入插件安裝

 

 

 

    2.若是沒有顯示左邊的工具欄，也能夠在View中找到Extensions進入插件安裝

 

 

 

    3.在搜索框中輸入Live Server，在搜索結果中找到以下，選擇安裝

 

 

 

    4.安裝完成須要重啓軟件插件才能生效

    5.重啓過以後，新建一個工做區，在這裏建立一個HTML文件作測試，注意單獨新建一個HTML文件拖動到IDE中是使用不了Live Server的，文件新建完成後咱們能夠在狀態欄上看到一個Go Live，單擊會自動打開瀏覽器並顯示

 

 

 

    6.若是沒有狀態欄上，也能夠在文件上單擊右鍵，選擇Open With Live Server這一項

 

 

 

    7.接下來修改代碼咱們只須要ctrl+S保存修改後的代碼，瀏覽器自動刷新，動圖顯示