VSCode通过Live Server插件启动本地服务器预览HTML，默认端口5500可自定义：1. 安装并启用Live Server插件；2. 打开含HTML文件的项目文件夹；3. 在设置中搜索live server，修改Live Server > Settings: Port为指定端口（如8080），或在settings.json中添加”liveServer.settings.port”: 8080；4. 右键HTML文件选择Open with Live Server，浏览器将打开对应端口地址（如http://127.0.0.1:8080）；若端口占用会提示更换。设置后全局生效，且需确保在项目文件夹内操作以保障正常运行。
VSCode 本身不直接运行 HTML 文件，而是通过插件（如 Live Server）启动本地服务器来预览网页。默认情况下，Live Server 使用端口 5500，但你可以自定义端口。以下是设置方法：
1. 安装 Live Server 插件
确保你已安装并启用了 Live Server 插件：
打开 VSCode 点击左侧活动栏的扩展图标（或按 Ctrl+Shift+X） 搜索 Live Server 点击安装
2. 打开项目文件夹
将包含 HTML 文件的文件夹添加到工作区。Live Server 需要上下文环境才能正确运行。
3. 修改 Live Server 端口设置
进入设置界面修改默认端口：
立即学习“前端免费学习笔记（深入）”；
点击左下角齿轮图标 → 设置 在搜索框中输入 live server 找到 Live Server > Settings: Port 将其值改为想要的端口号，例如 3000、8080 等
也可以通过编辑 settings.json 文件进行更灵活配置：
一览运营宝
一览“运营宝”是一款搭载AIGC的视频创作赋能及变现工具，由深耕视频行业18年的一览科技研发推出。
41 查看详情 在设置页面右上角点击“打开设置 (JSON)”图标 添加如下配置：”liveServer.settings.port”: 8080
保存后，Live Server 将使用指定端口启动。
4. 启动服务并查看效果
右键点击 HTML 文件 → 选择 Open with Live Server，浏览器会自动打开类似 http://127.0.0.1:8080 的地址，表示已在自定义端口运行。
如果端口被占用，Live Server 会提示并尝试下一个可用端口，也可手动更换避免冲突。
基本上就这些。设置一次后，后续所有项目都会默认使用该端口，除非单独覆盖。不复杂但容易忽略的是必须在项目文件夹内操作，否则 Live Server 可能无法正常启动。
以上就是vscode运行HTML如何设置端口_vscode运行HTML时自定义端口的设置方法的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/285504.html
微信扫一扫 
支付宝扫一扫 
