vscode插件系列-live server

最新推荐文章于 2024-06-02 21:41:04 发布
最新推荐文章于 2024-06-02 21:41:04 发布
阅读量1.5k 收藏 3
点赞数 2
分类专栏： 前端技术 文章标签： 前端 vscode插件 live server 服务
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_43277404/article/details/121558538
版权

在这里插入图片描述

Live Server

直译为实时服务器。这个插件是一个具有实时重新加载功能的小型开发服务器。用来破解html/js/css文件，而不适用于部署最终的站点。

优势

vscode拓展方便，一键安装架设本地服务器环境，并且可解决自动刷新的问题。

在需要打开的启动页右键 open with live server
在这里插入图片描述
在这里插入图片描述
默认接口为5500

在这里插入图片描述
就可以方便的启动项目

Yoo前端
关注
  • 2
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
VSCode-darwin-stable安装包
04-04
例如，你可以安装Linter插件进行代码风格检查，安装Live Server插件实现实时预览网页效果，或是安装Prettier自动格式化代码。VSCode的插件市场非常活跃，用户可以根据需要选择安装。 总的来说，VSCode-darwin-...
VSCode-darwin-universal
05-17
8. **实时预览**：对于前端开发，VSCode有Live Server这样的插件，可以在编辑时实时预览网页效果。 9. **代码导航和搜索**：强大的查找和替换功能，支持在整个项目中快速跳转到定义、查找引用、查找并替换文本。 ...
VS Code 右键打开 HTML 的插件 Open in Browser（在浏览器中打开）和 Live Server（实时服务器）
一个普通人
05-16 762
（在浏览器中打开）和（实时服务器）。
vscode中加入live server插件并在浏览器中展示
Arinck的博客
04-28 580
6.还有一种方法打开浏览器，在代码页面的任何位置右击，如图，选择“Open With Live Server”或者使用快捷键“alt+L ait+O”,也可以打开默认浏览器。5. 打开写好的html代码页面后，可以点击右下角的“Go Live”标识，即可自动打开默认浏览器并运行编写代码，写的过程中要及时保存代码可以实现网页代码的实时预览。2.在搜索框写入圈1“live server ”插件，选择圈2安装。3.等待安装完毕 后。4.安装插件完成后，
【VSCode】插件推荐 - Live Server
最新发布
m0_49239264的博客
06-02 495
简单易用：您可以通过在VSCode的侧边栏中找到Live Server插件，点击"Go Live"按钮或在HTML文件上右键选择"Open with Live Server"来启动服务。自动刷新功能：当您在VSCode中编辑HTML、CSS或JavaScript文件并保存更改时，Live Server会自动在浏览器中刷新页面，让您立即看到最新的变化。多浏览器支持：Live Server支持在不同的浏览器上运行，您可以在插件设置中指定默认浏览器，甚至可以为不同的项目设置不同的浏览器。
vscode的插件Live Server
qq_40324997的博客
07-08 401
点击vscode扩展按钮，搜索Live，点击安装，如图：（我的已经装过了，所以不显示安装按钮） 安装成功后，vscode右下角会出现雷达一样的小图标 点击该图标即可在默认浏览器查看网页了！！！ 此插件为前端开发启动了个服务，大大节省了开发刷新工作量，点赞！ ...
VScode live server插件
qq_43654065的博客
09-04 2492
live server插件安装后，可以使用live server运行代码。 一直不懂这和下面的Alt+B有什么区别，百度后大概有了了解。 使用live server运行代码，打开是一个服务器，下图上边是live server打开的界面网址，下图为默认浏览器打开的界面网址。可以看到live server打开的是一个服务器，服务器的默认端口是5500，用户也可以自行设置端口号、默认浏览器等。 采用liver server运行代码，可以实现边编写代码边程更新页面，非常适合开发工作者。 ...
web开发——前端基础（4）—— VSCode安装,以及在VSCode中配置liveServer。
m0_61506131的博客
12-29 576
web开发——前端基础（4）
VS Code -- Live Server
weixin_43588715的博客
03-22 5579
Live Server插件用来自动加载热部署前端页面相关的文件（.html/.js/.ts/.css），简单来说就是：快速启动本地服务，自动监听，不需要刷新就能更新内容。有了它之后调试前端页面再也不需要不停地手工去点击浏览器上的刷新按钮。
VSCode-darwin-universal.zip
04-15
8. **实时预览**：对于前端开发，VSCode有实时预览功能，如Live Server插件，可以快速查看代码在浏览器中的效果。 9. **性能优化**：VSCode-darwin-universal版本针对macOS进行了性能优化，确保在苹果硬件上运行...
VSCode 配置uni-app的方法
11-20
总结来说，配置VSCode进行uni-app开发涉及安装必要的CLI工具、创建项目、安装语法提示插件、设置代码块和样式处理器，并根据项目来源进行特定配置。遵循以上步骤，你将在VSCode中享受到高效且便捷的uni-app开发体验...
Visual Studio Code，vscode 扩展安装 扩展市场 安装插件,安装live server扩展,右键选择功能后浏览器直接打开页面
铭的博客
01-31 1397
3.等待几下，安装成功vscode右下角会有安装成功提示，就可以直接在页面使用了（无需重启软件）页面中直接右键后点击Open with Live Servre就会在浏览器打开这个页面了。2.找到需要安装的live server插件，后点击install进行安装。
VS Code中live server插件相关问题记录
2301_80174941的博客
02-22 814
VS Code中live server插件相关问题记录。记录了通过vscode中live server插件打开html文件和直接打开html文件网页内容不同的问题。
VScode下安装Live Server（自动刷新html页面）
追求卓越583的博客
08-30 5223
VScode下安装Live Server（自动刷新html页面）
vsCode中live server插件的安装及使用
热门推荐
gdxjznfw的博客
09-02 3万+
live server 插件是用来干嘛的? 本地开发常常需要搭建临时的服务,作用 : 1.模拟服务器的方式打开页面 2.代码改动后,会自动刷新页面 安装 : 使用 : 1.使用要求 : 要求项目文件夹 Demo 要单独出现在vscode侧边栏。以下两种都可以 文件夹打开错误示范 : tip : 写项目时大家最好留一个要编辑的项目文件夹在vacode侧边栏就可以,这样清清爽爽写代码,心里也舒畅(头发也掉的少啦) 2.使用 live server 插件打开页面: 如果vscode侧边栏只有项目文件夹De
VS Code插件live server的安装和使用
sinat_37024730的博客
02-06 3911
VS code中live server插件的安装和使用
vscode怎么使用live server
Amouzy的博客
03-02 4764
步骤： 1.点击左边活动栏最下面的插件按钮 2.在输入框搜索live server插件。（大概输完“live”下面就出现了） 3.安装live server插件 4.此时右下角状态栏会出现“go live” 图解： 像这样子，就可以了： ...
vscode的Live Server使用
ZJC'博客
02-04 1152
vscode安装live-server插件
06-28
4. 找到“Live Server”插件并点击“安装”按钮。 5. 安装完成后，点击“启用”按钮。 6. 在编辑器中打开HTML文件，右键单击文件并选择“在Live Server中打开”。 7. 现在，您可以在浏览器中查看您的网页，并且当您...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Yoo前端

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值