小白请问下在 vscode 里编辑，然后在浏览器中实时显示效果是怎么实现的？是用了什么扩展吗？

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

• 请不要在回答技术问题时复制粘贴 AI 生成的内容

这是一个创建于 1273 天前的主题，其中的信息可能已经有所发展或是发生改变。

另外比如说这个扩展：Bracket Pair Colorizer 2

它的简介是：A customizable extension for colorizing matching brackets，有什么扩展能翻译一下这种简介吗？我英语不大行，希望万能的 V 友支支招哈哈

扩展

简介

支支

VSCode

13 条回复 • 2021-07-05 10:20:17 +08:00

Trim21

2021-07-04 12:02:14 +08:00 via Android

你说的是 instant markdown 插件吗？插件开了一个 HTTP 服务器渲染了编辑的内容，所以你就能在浏览器里面打开了

golangLover

2021-07-04 12:02:40 +08:00 via Android

react 就是自带的。普通 html 的应该是 live reload

Jirajine

2021-07-04 12:04:59 +08:00 via Android

hot reload

romancekami

2021-07-04 12:30:42 +08:00 via Android

@Trim21 不好意思老哥，我好像没写清楚标题，我是之前看到一个 css 的视频，作者一边在 vscode 里编辑，然后在 chrome 里就有实时效果显示

lysS

2021-07-04 12:33:50 +08:00

扩展 Live Server

romancekami

2021-07-04 12:33:51 +08:00 via Android

@golangLover 我标题没写清楚大意了，是之前看到的一个前端 css 的视频，作者在 vscode 里编辑，然后浏览器就有实时效果显示，我是小白，刚开始用 vscode

B3C933r4qRb1HyrL

2021-07-04 12:34:00 +08:00

如果是普通 HTML + CSS 的话，可以看看 live server 插件。

romancekami

2021-07-04 12:35:55 +08:00 via Android

ok，我说的就是前端的，感觉楼上的一些老哥误解了，怪我标题没写清楚，thank you

xenme

2021-07-04 14:12:31 +08:00 via iPhone

@romancekami 上面说到就是你要的。
估计只有你自己还在以为别人理解错了。

skys215

2021-07-04 14:37:37 +08:00

以前有个软件叫 f5，会监听文件改动，然后刷新页面。

xnotepad

2021-07-04 15:10:59 +08:00

和前端的热编译一个原理吧。
插件起一个 HTTP 服务，浏览器打开之后，和浏览器建立 websocket 链接，之后插件这边就可以控制浏览做一些刷新之类的操作。

romancekami

2021-07-04 17:23:07 +08:00 via Android

@xenme 嗯，确实我傻了，用了一下就是 live server 这玩意儿，多谢 v 友们的帮助👍

TomatoYuyuko

2021-07-05 10:20:17 +08:00

热重载 websocket 实现的，你可以看到 network 里跑了一堆