天行健，君子以自強(qiáng)不息；地勢坤，君子以厚德載物。
每個(gè)人都有惰性，但不斷學(xué)習(xí)是好好生活的根本，共勉！
文章均為學(xué)習(xí)整理筆記，分享記錄為主，如有錯(cuò)誤請(qǐng)指正，共同學(xué)習(xí)進(jìn)步。
一、問題重現(xiàn)
1. VSCode中編寫HTML代碼
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
這是一個(gè)測試界面，驗(yàn)證是否實(shí)時(shí)刷新到瀏覽器頁面
</body>
</html>
2. Live Server插件
首先下載Live Sever 插件
參考：https://blog.csdn.net/mo_sss/article/details/132321681
下載后重啟VSCode，代碼界面右鍵Open with Live Server 可將代碼打開到瀏覽器中查看
如圖所示：
3. 修改代碼
修改代碼，在文本后添加以下內(nèi)容
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
這是一個(gè)測試界面，驗(yàn)證是否實(shí)時(shí)刷新到瀏覽器頁面
<br>20230822
</body>
</html>
查看瀏覽器頁面
并無反應(yīng)，還是原來的內(nèi)容，刷新也沒用
二、問題分析
1. Live Server
網(wǎng)上查看了很多，有人說使用Live Server就可以實(shí)現(xiàn)實(shí)時(shí)刷新，我已經(jīng)安裝了Live Server 依舊存在這個(gè)問題
2. 重啟VSCode
還有人說不生效可以多重啟幾次VSCode，我重啟了四五次還是不行，不知道是不是我重啟的次數(shù)不夠多
3. Live Server Preview
也有人說下載Live Server Preview插件可將修改內(nèi)容實(shí)時(shí)刷新到頁面，于是我安裝了這個(gè)插件，可依舊沒有效果
4. 自動(dòng)保存
最終想到了代碼保存的方向，由于VSCode沒有開啟自動(dòng)保存的功能，所以修改后的代碼是未保存狀態(tài)，所以無法實(shí)時(shí)顯示
三、問題解決
1. 打開自動(dòng)保存代碼設(shè)置
左下角打開設(shè)置
設(shè)置界面搜索save
在auto save中選擇afterDelay選項(xiàng)
2. 瀏覽器查看頁面
重新右鍵Open with Live Server
瀏覽器查看
文章來源：http://www.zghlxwxcb.cn/news/detail-836217.html
3. 再次修改代碼內(nèi)容
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
這是一個(gè)測試界面，驗(yàn)證是否實(shí)時(shí)刷新到瀏覽器頁面
<br>20230822
<br>20230822
</body>
</html>
4. 再到瀏覽器頁面查頁面內(nèi)容
如圖，已經(jīng)實(shí)時(shí)刷新代碼對(duì)應(yīng)的頁面了
文章來源地址http://www.zghlxwxcb.cn/news/detail-836217.html
到了這里，關(guān)于VSCode中修改HTML代碼無法實(shí)時(shí)刷新到瀏覽器頁面的問題解決的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
