vscode配置浏览器和Live Server

已于 2022-09-24 18:02:50 修改
阅读量4.2k 收藏 7
点赞数 1
分类专栏： # Vue 文章标签： vscode ide 编辑器
于 2022-09-24 18:01:58 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/liu_wen_wen/article/details/127028184
版权
本文详细介绍了如何在Visual Studio Code (VSCode) 中配置浏览器为Chrome，并安装及设置LiveServer插件来实现代码实时预览。步骤包括：在设置中将‘View-in-browser’指定为Chrome，通过扩展商店安装LiveServer，以及在settings.json中设定LiveServer默认启动浏览器为Chrome。
摘要由CSDN通过智能技术生成

vscode配置浏览器和Live Server

①首先将“View-in-browser”配置为chrome浏览器：

点击“管理”，在“设置”中将“View-in-browser”设置为“浏览器名称（例：chrome）”。

View in browser 翻译成中文：在浏览器中查看
在这里插入图片描述

②安装“Live Server”插件：

点击“扩展”，在搜索框中搜索“Live Server”，然后进行下载安装。

在这里插入图片描述

③配置“Live Server”插件:

1.右键单击“Live Server”组件，选择“扩展设置”，找到“设置”中的“Live Server…”。

在这里插入图片描述

2.点击“在setting.json中编辑”。（我之前设置默认的浏览器是Microsoft Edge浏览器）

在这里插入图片描述

3.在“ ”中填写对象的浏览器（英文）名称即可。

在这里插入图片描述

参考：

VScode 浏览器配置
https://blog.csdn.net/github_36544258/article/details/126321374

小丫头爱打盹
关注
专栏目录
VScode编写html利用live Server扩展在浏览器无法打开 解决方法如下
haimingjavazhilv的博客
03-23 2392
VScode编写html利用live Server扩展在浏览器无法打开 1.
VSCode（Visual Studio Code）和Chinese、Live Server插件的下载、安装及使用
Satellite_Q的博客
03-21 7820
vscode全称：Visual Studio Code。它是Microsoft公司在美国的一个项目:一个跨平台的源代码编辑器,用于在Mac OS X,Windows和Linux上运行的现代Web和云应用程序。通俗地说,是一款编辑器。vscode集成了现代编辑器应具有的所有功能，包括语法突出显示，可自定义的热键绑定，括号匹配和代码片段集合，该编辑器还具有开箱即用的Git支持。
vscode view-in-browser插件 koppt.vscode-view-in-browser-1.0.5.vsix
08-26
适合不能联网或联网安装失败不成功的情况，需要安装vscode view-in-browser插件的前端童靴下载。 安装时运行CMD 进入dos命令行 运行命令code --install-extension koppt.vscode-view-in-browser-1.0.5.vsix 即可
VSCode调试揭秘：Live Server助力完美测试Cookie与Session，远超“Open in Browser“！
啊猪是的读来过倒的博客
06-09 1886
适用于简单的本地文件访问，但不支持跨域Cookie和Session的处理。通过本地HTTP服务器访问文件，支持跨域Cookie和Session的处理，并提供更多的配置灵活性。对于需要测试跨域功能的开发者来说，它是一个更好的选择。所以，在开发过程中，如果需要处理跨域相关的Cookie和Session，建议使用。然而，如果你只是需要简单地查看本地HTML文件，open in browser 可能就足够了。
vscode-live-server 常见问题解决方案
gitblog_07466的博客
09-13 413
vscode-live-server 常见问题解决方案 vscode-live-server Launch a development local Server with live reload feature for static & dynamic pages. ...
VSCode插件之View In Browser/Open in Browser‘在浏览器中查看’
热门推荐
天马3798
11-19 13万+
VSCode插件View InBrowser，在浏览器中查看 当前插件功能类似Atom中的“Run-In-Browser”. 插件功能描述：从浏览器中查看html文件，使用系统的当前默认浏览器 注：只支持html文件 默认的快捷键Ctrl+F1,可以自定义修改，命令名称为：“extension.viewInBrowser” 详细可以参考截图： 其他插件： VsCode
vsCode之Live Server
wch19960518的博客
05-30 792
我本地一个前端项目需要引入另一个项目的线上地址，但又不想本地搭一套服务，于是就在vsCode中装了这个插件。
关于VSCode如何设置Live Server默认浏览器（Open with Live Server）
weixin_42793577的博客
03-12 1537
Open with Live Server如何设置默认浏览器 1.文件->首选项->设置 2.搜索 “live” ，找到 “Live Server › Settings: Custom Browser”
vscode如何设置默认打开的浏览器为Chrome
10-14
总结来说，通过安装“Open in Browser”插件并设置默认浏览器为Chrome，以及利用“Live Server”插件进行页面热更新，你可以提升在VSCode中的Web开发效率。记住，持续关注和更新你的插件库，保持VSCode的优化配置，...
vscode里的live server怎么改变默认浏览器
最新发布
09-20
3. 找到 live-server 配置部分：在设置文件中，找到包含 "liveserver" 或 "liveserverStartInBrowser" 字段的部分，可能是类似这样的： ``` { "liveshare.enabled": false, "liveshare共生模式": false, // ......
vscode中浏览器的配置
03-29
在VS Code中使用浏览器需要先安装相应的插件，...需要先安装Chrome浏览器和Chrome浏览器的调试工具，然后在VS Code的启动配置中配置调试选项。 以上是常用的几种浏览器配置方法，具体使用还需要根据实际情况进行选择。
VS Code -- Live Server
2301_76778596的博客
03-16 3551
Live Server插件用来自动加载热部署前端页面相关的文件（.html/.js/.ts/.css），简单来说就是：快速启动本地服务，自动监听，不需要刷新就能更新内容。有了它之后调试前端页面再也不需要不停地手工去点击浏览器上的刷新按钮。
VsCode如何设置Live server默认浏览器（Open with Live Server）
axbhealj的博客
05-20 2930
VsCode如何设置liveserver打开的默认浏览器（Open with Live Server ）
【VSCode】插件推荐 - Live Server
m0_49239264的博客
06-02 1318
简单易用：您可以通过在VSCode的侧边栏中找到Live Server插件，点击"Go Live"按钮或在HTML文件上右键选择"Open with Live Server"来启动服务。自动刷新功能：当您在VSCode中编辑HTML、CSS或JavaScript文件并保存更改时，Live Server会自动在浏览器中刷新页面，让您立即看到最新的变化。多浏览器支持：Live Server支持在不同的浏览器上运行，您可以在插件设置中指定默认浏览器，甚至可以为不同的项目设置不同的浏览器。
vscode 使用View In Browser插件预览运行html文件
weixin_38171468的博客
05-26 3073
1.打开vscode编辑器，点击编辑器主界面左上侧第五个小图标——‘扩展’按钮； 2.进入扩展搜索右拉框，在应用商店搜索框中输入“view”会自动进行搜索,找到view in browser,点击安装即可 3.安装成功图片如下 4.点击左侧第一个资源管理器，回到资源管理器界面，选择你想要查看的html文件； 5.选中html文件点击右键，会出现View In Browser 选项, 6.点击View In Browser运行代码就能使用用浏览器预览文件了 ...
VScode 中如何设置live Server 插件默认浏览器
xjkelwxz的博客
07-16 1930
VScode 中如何设置live Server 插件默认浏览器
Vscode使用Live Server
wuqihawubito的博客
07-15 714
先安装live Server： 然后使用 CTRL+SHIFT+P ,搜索live server： 点击 Open with server就可以打开这个服务器了。 如果要用这个服务器打开具体的html文件：
VScode中html网页, 用Live Server启动怎么操作
weixin_42584507的博客
02-14 1650
要在 VSCode 中使用 Live Server 启动 HTML 网页，需要执行以下步骤： 在 VSCode 中打开要启动的 HTML 文件。 在 VSCode 的侧边栏中找到扩展(Extensions)，并安装 "Live Server" 扩展。 安装完成后，打开 HTML 文件，在编辑器的右上角会出现一个 "Go Live" 的图标，点击后即可启动 Live Server。 Live...
vscode配置浏览器
学亮编程手记
12-14 1914
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值