使用live server (vscode插件)实现实时服务器

最新推荐文章于 2024-06-09 10:20:42 发布
最新推荐文章于 2024-06-09 10:20:42 发布
阅读量1.6k 收藏 3
点赞数 1
分类专栏： vscode 实用插件 文章标签： visual studio code html5 html javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43834227/article/details/106019984
版权

使用live server 插件本地开发实现热加载，实时查看网页效果

  1. 在vscode 扩展中搜索 live server ,并安装在这里插入图片描述
  2. 在设置中写上配置在这里插入图片描述
"liveServer.settings.donotShowInfoMsg": true,
"liveServer.settings.AdvanceCustomBrowserCmdLine": ""

3.在vscode 选中想要启动服务的页面，右键菜单里选择 Open with Live Server ,就会在浏览器中自动打开页面 http://127.0.0.1:5500/.nuxt/loading.html
在这里插入图片描述
4. 在选中文件底部，点击Go Live 也可以启动服务在这里插入图片描述
以上，即可启动一个具有热更新的本地服务器

渡渡鸟7
关注
  • 1
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
【VSC插件】LiveServer 安装使用指南
hzxOnlineOk的博客
06-29 6530
当我们碰到文件引入导致的跨域问题，而测试环境又不存在不同源时，live-server这个插件允许我们起一个前端本地服务，这样子就把资源和网站服务同源了 1.左键点击下图圈出的图标或者快捷键Ctrl+Shift+X，到下图的EXTENSIONS界面。 2.搜索Live Server点击绿色的Install即可安装，笔者是已经装好了所以才没有Install按钮的。 3.安装成功的表示是如下图所示，右键HTML文件有Open with Live Server选项（如果没有这个选项的话..
【VSCode】插件推荐 - Live Server
m0_49239264的博客
06-02 446
简单易用：您可以通过在VSCode的侧边栏中找到Live Server插件，点击"Go Live"按钮或在HTML文件上右键选择"Open with Live Server"来启动服务。自动刷新功能：当您在VSCode中编辑HTML、CSS或JavaScript文件并保存更改时，Live Server会自动在浏览器中刷新页面，让您立即看到最新的变化。多浏览器支持：Live Server支持在不同的浏览器上运行，您可以在插件设置中指定默认浏览器，甚至可以为不同的项目设置不同的浏览器。
VSCode调试揭秘：Live Server助力完美测试Cookie与Session，远超“Open in Browser“！
最新发布
啊猪是的读来过倒的博客
06-09 1153
适用于简单的本地文件访问，但不支持跨域Cookie和Session的处理。通过本地HTTP服务器访问文件，支持跨域Cookie和Session的处理，并提供更多的配置灵活性。对于需要测试跨域功能的开发者来说，它是一个更好的选择。所以，在开发过程中，如果需要处理跨域相关的Cookie和Session，建议使用。然而，如果你只是需要简单地查看本地HTML文件，open in browser 可能就足够了。
Visual Studio Code，vscode 扩展安装 扩展市场 安装插件,安装live server扩展,右键选择功能后浏览器直接打开页面
铭的博客
01-31 1381
3.等待几下，安装成功vscode右下角会有安装成功提示，就可以直接在页面使用了（无需重启软件）页面中直接右键后点击Open with Live Servre就会在浏览器打开这个页面了。2.找到需要安装的live server插件，后点击install进行安装。
VS Code -- Live Server
weixin_43588715的博客
03-22 5546
Live Server插件用来自动加载热部署前端页面相关的文件（.html/.js/.ts/.css），简单来说就是：快速启动本地服务，自动监听，不需要刷新就能更新内容。有了它之后调试前端页面再也不需要不停地手工去点击浏览器上的刷新按钮。
VS Code中live server插件相关问题记录
2301_80174941的博客
02-22 792
VS Code中live server插件相关问题记录。记录了通过vscode中live server插件打开html文件和直接打开html文件网页内容不同的问题。
vscode插件离线安装包
08-30
2. **ritwickdey.LiveServer-5.7.9.vsix**: Live Server 是一个实时预览服务器插件，可以在本地启动一个 Web 服务器，并实时刷新浏览器，每当你的 HTML、CSS 或 JavaScript 文件发生变化时，无需手动刷新，极大地...
vscode：VSCode插件
02-06
Live Server插件则提供了实时预览功能，代码保存后网页会自动刷新。 总的来说，VSCode的插件系统极大地扩展了其基础功能，满足了开发者多样化的需求。无论是语言特性支持、代码质量和风格检查、调试工具，还是项目...
补充vscode插件
11-02
5. **Live Server**：开启一个实时刷新的本地服务器，方便进行前端网页开发，每次保存更改都会自动刷新浏览器。 6. **Path Intellisense**：增强路径自动完成，提高文件引用的便捷性。 7. **Debugger for Chrome**...
LiveServer.jl：具有用于Julia的实时重载功能的简单开发服务器
02-04
`LiveServer.jl` 可以很好地与各种Julia IDE和代码编辑器集成，例如VSCode的Julia插件，通过这些工具可以实现代码编辑、运行和调试的一体化体验。 ### 7. 拓展与自定义 `LiveServer.jl` 是可扩展的，允许开发者...
Live Server Web Extension-crx插件
04-02
您必须为vscode安装Live Server扩展以才能使用此添加项。 按照此链接设置：https：//github.com/ritwickdey/live-server-web-extension#Setup 演示：...
Visual Studio Code 常用扩展插件
为技术而生
07-06 892
1、Beautify：格式化代码。 2、Chinese：中文汉化。 3、Live Server：本地服务器。 4、ESLint：语法规则和代码风格的检查工具。 5、Vetur：将.vue文件中的语法进行高亮显示,。
推荐13款常用的Vscode插件，提高前端日常开发效率
热门推荐
DEVELOPERAA的博客
11-02 2万+
推荐13款常用的Vscode插件，提高前端日常开发效率
在vscode中安装使用live Server（前端搭建自己的本地服务器环境）
z1093541823的博客
04-27 3617
在vscode中安装使用live Server（前端搭建自己的本地服务器） 在扩展中搜索live Server，找到并下载，下载完后点击设置图标，点击扩展设置
【1】VS code 关于live sever扩展插件无法自动刷新的解决方案
weixin_46142047的博客
12-11 6935
【1】VS code 关于live sever扩展插件无法自动刷新的解决方案 问题：在扩展程序中安装了live sever，已经启用，但在使用过曾在不会保存之后自动刷新网页。 1、在电脑本地找到安装插件的路径，将关于live sever的文件全部删除，一般安装路径在： C:\Users\XX.vscode\extensions 注：XX一般为电脑的用户名称 2、打开VS code ，重新安装live sever，重新启动测试；若问题依旧，依次打开： 文件-首选项-设置，找到如图位置点开 3、将如下代码粘
firefox代理插件 简单_VsCode插件之Live Serve探秘.(上)
weixin_39531780的博客
11-25 446
设定值liveServer.settings.port：自定义Live Server的端口号。如果需要随机端口号，请将其设置为0。默认值为5500。liveServer.settings.root注意：要在工作空间文件夹结构之间更改服务器的根目录，请使用/和来自工作空间的绝对路径。范例：/sub_folder1/sub_folder2。现在sub_folder2将是服务器的根目录。默认值...
推荐：Live Server — 实时开发服务器
gitblog_00006的博客
05-11 420
推荐：Live Server — 实时开发服务器 项目地址:https://gitcode.com/ritwickdey/vscode-live-server Live Server 是一个专为前端开发者设计的本地开发服务器，它带有实时刷新功能，适用于静态和动态页面。无论你是PHP开发者还是JavaScript爱好者，这款Visual Studio Code插件都能让你的开发流程更加流畅。 项目介...
vscode插件liveserver
03-16
liveserver是一款非常实用的VSCode插件，它可以帮助开发者在本地快速启动一个本地服务器，以便于在浏览器中实时预览网页的效果。使用liveserver插件，开发者可以省去手动刷新浏览器的麻烦，从而提高开发效率。此外，...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值