设置 vscode 自动保存更改然后用 live server 实时在 chrome 浏览器显示挺爽的， 但我发现 div 定义的盒子会莫名奇妙被覆盖（不太清楚是被覆盖还是属性丢失），导致显示异常，感觉像是 live-server 的问题，但我不知道问题出在哪里，大佬们帮忙看看？
首先我先给两个盒子设置背景色：
使用扩展 open in browser 时在 chrome 是正常显示的，上下两个盒子，上面粉色，下面黄色:
使用扩展 live server 时在 chrome 显示异常，只能显示上面那个粉色盒子，黄色盒子不见了，只能在刷新的瞬间看到黄色的盒子似乎被粉色盒子给覆盖了:
在 vscode 里面针对第二个盒子写的 background-color,width,height 属性似乎加载不到 chrome 里面，不知道是不是 live server 没有传递这些属性给浏览器
希望大佬们帮忙呀，乐意的话可以加 vx: romancekami 远程帮忙看看，我是前端新手...
 |
1
Buges Dec 23, 2021 via Android
这个扩展有问题那就别用它。
另外这些直接打开浏览器预览的插件裸写 html/css 的话还行，上框架 /库的话就无效了。正常前端开发的实时预览一般由构建工具提供，推荐使用 vite 。 |
 |
2
romancekami OP @Buges 好滴 感谢推荐
|
 |
3
chengxy Dec 23, 2021
复现了，然后我去看了 GitHub ，插件上次更新时间是 19 年 4 月，有 1600 多个打开的 issues ，所以建议还是放弃这个插件吧。
|
 |
4
adeng Dec 23, 2021 via Android
live server 作者说不维护了 https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer ，微软官方有个叫 live preview 功能和它一样
|
 |
5
kidonng Dec 23, 2021 via Android
|
|
6
romancekami OP @chengxy ok 看来是插件的问题 谢谢老哥
|
|
7
romancekami OP 感谢大佬们的推荐 V2 牛逼！！!
|
Select Language