浅析VSCode中Open with live server

一、使用方式

在html文件中右键,选择"open with live server"
VSCode界面示意图

二、原理和功能

1.打开的是哪个浏览器

打开的浏览器是电脑的默认浏览器,默认浏览器可以在浏览器的"设置"中自行设置

2.原理

在主机的5500端口开一台内置的小服务器,并且将当前VSCode打开的文件夹中的所有文件作为这台服务器的根资源进行使用
VSCode右下角显示的端口号 在浏览器中打开的文件地址栏显示

127.0.0.1表示本主机,冒号后面写主机号
查看当前服务器端口

3.报错

打开html文件之后,会发现浏览器报错:找不到favicon.ico,这说明根目录下没有图标文件,只需要在根目录下放一个名为favicon.ico的文件表示浏览器图标即可
报错示意图 浏览器图标 设置好的图标示意图 将该文件放在根目录下示意图

相关推荐
十子木2 小时前
vim 常用快捷键汇总
linux·编辑器·vim
EleganceJiaBao3 小时前
【Neovim】Vi、Vim、Neovim 与 LazyVim:发展史
linux·编辑器·vim·vi·neovim·lazyvim
北冥有鱼被烹7 小时前
【微知】vscode如何开启markdown的review模式?
ide·vscode·编辑器
携欢15 小时前
CodeQL(Mac)安装与测试(Visual Studio)简明指南
ide·vscode·macos
Android小码家17 小时前
Vscode + docker + qt 网络监听小工具
vscode·qt·docker
中国胖子风清扬17 小时前
Rust 序列化技术全解析:从基础到实战
开发语言·c++·spring boot·vscode·后端·中间件·rust
虫无涯19 小时前
【分享】基于百度脑图,并使用Vue二次开发的用例脑图编辑器组件
前端·vue.js·编辑器
程序员的世界你不懂20 小时前
【Flask】测试平台中,记一次在vue2中集成编辑器组件tinymce
编辑器
susu108301891121 小时前
如何选择文件夹然后用vscode直接打开
ide·vscode·编辑器
非得登录才能看吗?21 小时前
开发环境 之 编辑器、编译器、IDE梳理
ide·编辑器