Visual Studio Code，vscode 扩展安装 扩展市场 安装插件,安装live server扩展,右键选择功能后浏览器直接打开页面

安装Live Server扩展

Live Server的作用好处

• Live Server插件可以自动加载热部署前端页面相关的文件（.html、.js、.ts、.css），简单来说就是快速启动本地服务，自动监听，你这边改了代码那边立即生效，不需要手动刷新页面内容随之更新
• 方便您快速的在浏览器中查看、调试你的网页

安装Live Server

1.找到扩展市场

还可以在 Windows系统上按 Ctrl+Shift+X 或在 macOS 上 按 Command+Shift+X 打开 “扩展 市场”

2.找到需要安装的live server插件，后点击install进行安装

3.等待几下，安装成功vscode右下角会有安装成功提示，就可以直接在页面使用了（无需重启软件）

成果展示

页面中直接右键后点击Open with Live Servre就会在浏览器打开这个页面了

.