vs code安装配置live server配置Browser浏览器、改Port端口号、改Host地址

最新推荐文章于 2024-06-09 10:20:42 发布
最新推荐文章于 2024-06-09 10:20:42 发布
阅读量1.2w 收藏 40
点赞数 14
分类专栏： 编译器笔记 App安卓/iOS开发/小程序 文章标签： vscode vs
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Jo_liver/article/details/117458580
版权

vs code安装配置live server配置Browser浏览器、改Port端口号、改Host地址

一、vs code扩展搜“Live Serve”，安装即可

在这里插入图片描述

二、点击查看扩展，找到Live Server，点击【设置】按钮，选-【扩展设置】

在这里插入图片描述

三、配置自定义（浏览器、Host、Port）

1、配置默认浏览器打开

在这里插入图片描述

2、配置修改Host地址为localhost（默认127.0.0.1）

找到-【Host】项，将127.0.0.1改为loaclhost，保存即可，不影响可不改动。
在这里插入图片描述

3、配置固定端口号为8080（默认为5500）

找到Port项，点击-【在setting.json中编辑】
在这里插入图片描述
修改“liveServer.setting.port”的值为8080，保存即可。
在这里插入图片描述

三项常用的基本满足，看效果：
打开项目，进入文件，点击右下角-【Go Live】，项目就会自动打开浏览器进入项目了
在这里插入图片描述
看效果：
在这里插入图片描述

残阳曦月
关注
  • 14
    点赞
  • 踩
  • 40
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
Live Server的端口问题
zzy7075的专栏
10-08 3360
本人使用nginx启动了端口5550的网站，然后在VSCode也启动一个Live Server，通过live server扩展配置如下： { "liveServer.settings.donotShowInfoMsg": true, "liveServer.settings.port": 5550, "workbench.startupEditor": "newUntitledFile", "[javascript]": { }, ...
redis中修改配置文件中的端口号 密码方法
12-16
找到包含 `port` 关键字的行，将默认的端口号（通常是 6379）改为你需要的端口号，例如 8888。 3. **重启 Redis 服务**：在命令提示符（CMD）中，使用以下命令带配置文件启动 Redis 服务： ``` redis-server.exe ...
vscode+live server——更改端口号——基础积累
yehaocheng520的博客
02-07 9628
vscode+live server——更改端口号——基础积累
VSCode调试揭秘：Live Server助力完美测试Cookie与Session，远超“Open in Browser“！
最新发布
啊猪是的读来过倒的博客
06-09 1160
适用于简单的本地文件访问，但不支持跨域Cookie和Session的处理。通过本地HTTP服务器访问文件，支持跨域Cookie和Session的处理，并提供更多的配置灵活性。对于需要测试跨域功能的开发者来说，它是一个更好的选择。所以，在开发过程中，如果需要处理跨域相关的Cookie和Session，建议使用。然而，如果你只是需要简单地查看本地HTML文件，open in browser 可能就足够了。
vscode配置live-server转发代理的过程
sunhcsss的博客
03-24 2257
步骤： 1.在vscode中设置转发的配置 baseUri为代理时的location proxyUri为要请求要代理的地址 2.重启live-server服务器 关闭之后重新打开，html中的跨域请求就可以正常转发了
关于VSCode如何设置Live Server默认浏览器（Open with Live Server）
weixin_42793577的博客
03-12 1080
Open with Live Server如何设置默认浏览器 1.文件->首选项->设置 2.搜索 “live” ，找到 “Live Server › Settings: Custom Browser”
在vscode中安装使用live Server（前端搭建自己的本地服务器环境）
z1093541823的博客
04-27 3622
在vscode中安装使用live Server（前端搭建自己的本地服务器） 在扩展中搜索live Server，找到并下载，下载完后点击设置图标，点击扩展设置
vs code中修改Go live本地前端调试服务器端口号
CRMEB小程序商城的博客
04-14 1422
现在，前后端分离成了标准，前端javascript的ES6一些模块导入导出用法，也得在服务器端运行，vscode可以说是开源跨平台的开发利器，Go live插件也成了必装的插件，但默认端口是5500，难免有时候会和其他端口冲突，那么，如何修改端口号，手把手带你起飞！ 点击插件 ==》搜索 ==》扩展设置 在配置文件直接修改这两项即可实现！ 了解更多开源项目：http://github.crmeb.net/u/xingfu ...
Mac上Go环境和VS Code的正确安装与配置方法
09-20
Go语言是一个新兴的语言。下面介绍一下如何在Mac系统下安装和使用这个语言，Go语言提供了mac下安装包，可直接下载安装包点击安装
Visual Studio Code安装和配置的教程
08-19
Visual Studio Code安装和配置教程 Visual Studio Code是微软推出的轻量级代码编辑器，功能强大且灵活，广泛应用于软件开发、Web开发和其他编程领域。以下是Visual Studio Code安装和配置的详细教程。 一、安装...
使用VS Code的开发环境配置教程图文详解
08-19
VS Code的开发环境配置需要安装Build Tools、安装VS Code、安装插件、设置VS Code为默认的源代码编辑器等步骤。通过这些步骤，可以设置VS Code的开发环境，提高开发效率和代码质量。 知识点7: VS Code的应用场景 ...
解决vscode插件Live Server默认端口号无法修改的问题
weixin_46166330的博客
10-31 3026
首先你先看看你的工作区有没有一个.vscode的文件夹，点开以后有一个setting.json的文件，没错就是它，点进去修改就OK了；但如果你发现你确实修改了，但是重新运行时依然还是原来的端口号，或者更甚的，一开始就直接不是5500，可能是5501、5502等等，先随便运行一个html文件，注意看右下角的数字，如果是5500，那么很大可能是默认的，很容易修改。找到这个以后，点进去，就可以改为你想要的，在重新运行html文件，你就可以看到修改成功了。先在你的扩展里找到Live Server插件=>扩展设置。
vscode 不能编辑
qq1273753254的专栏
04-10 251
vscode 安装 vim 插件 禁用或者卸载vim 插件
VS Code+Live Server插件开发游戏并结合内网穿透分享好友异地访问
2401_84182842的博客
04-12 640
本篇教程，我们将通过VS Code实现远程开发MENJA小游戏，并通过cpolar内网穿透发布到公网，分享给无论身在何地的好友体验由你开发的游戏的乐趣。话不多说，下面就来教大家如何使用VS Code编写一个MENJA切块小游戏，这里我们使用VS Code并结合Live Server插件进行调试，Live Server可以实现一键安装，实现自动刷新，架设本地服务器环境。如何使用VS Code编写一个小游戏并结合内网穿透实现远程访问。
live-server实时简易服务器
海阔天空
04-06 467
live-server实时简易服务器
2022.9.24 浏览器请求接口跨域问题解决
xiaoxiaocainiao_的博客
09-24 1189
同源指的是协议相同、域名相同，端口相同 域的组成：协议 + 域名 + 端口 跨域：不同源的网址之间的通信会出现跨域，一旦出现跨域，请求响应会被浏览器拒绝。 其实跨域和跨源就是同个意思。
VS Code -- Live Server
2301_76778596的博客
03-16 3218
Live Server插件用来自动加载热部署前端页面相关的文件（.html/.js/.ts/.css），简单来说就是：快速启动本地服务，自动监听，不需要刷新就能更新内容。有了它之后调试前端页面再也不需要不停地手工去点击浏览器上的刷新按钮。
简单记录下live-server使用
C_xran的博客
10-06 723
简单使用下liver-server
live-server 的使用
乐辞的博客
10-24 5429
live-server 是一款 npm 工具，全局安装 npm i -g live-server 后，项目目录使用 live-server 命令行命令便可直接在浏览器中预览（默认找 index.html，其他需要带上文件名空格后跟在后面），并且自动全局监听实时更新。但现在流行修改文件浏览器自动刷新 hot socketing（热拔插），如 live-reload。本地开发常常需要搭建临时的服务，第一时间我们会想到用 http-server。而 live-server 实现了上面这三个插件的功能。
安装vs code server
06-12
安装 VS Code Server 可以让您在远程计算机上使用 VS Code 的功能，可以通过浏览器远程访问 VS Code，从而实现编写代码的目的。 以下是在 Linux 上安装 VS Code Server 的步骤： 1. 下载 VS Code Server 安装包： 您可以从官方网站下载适用于 Linux 的 VS Code Server，下载链接为：https://code.visualstudio.com/download。 2. 将安装包解压缩到指定目录： 使用以下命令将安装包解压缩到指定目录： ```bash tar -xvf {vscode-server-package-name}.tar.gz -C {install-directory} ``` 其中，`{vscode-server-package-name}` 是下载的 VS Code Server 安装包名称，`{install-directory}` 是您要将 VS Code Server 安装到的目录。 3. 启动 VS Code Server： 使用以下命令启动 VS Code Server： ```bash cd {install-directory} ./{vscode-server-package-name}/bin/code-server ``` 其中，`{install-directory}` 是您刚才选择的安装目录，`{vscode-server-package-name}` 是您下载的 VS Code Server 安装包名称。 4. 访问 VS Code Server： 在浏览器中输入 `http://{your-server-ip}:8080`，就可以访问 VS Code Server 了。其中，`{your-server-ip}` 是您的远程计算机的 IP 地址。 这样就可以在远程计算机上使用 VS Code 了。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值