vs code安装live server改端口号、亲测有用

最新推荐文章于 2024-09-22 23:55:28 发布

貂个小孩，解解蝉

最新推荐文章于 2024-09-22 23:55:28 发布

阅读量2.2k

点赞数 5

分类专栏： live serve 文章标签：前端

本文链接：https://blog.csdn.net/qq_53659329/article/details/124633752

版权

live serve 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

1. 引言:

在网上搜索了一下live serve 修改端口号的方式,发现大家直接就是修改 .json文件里面的配置,我试过了,没啥用,但是浏览器一直报端口被占用的红的警告,找了好多个没用.

2. 别人的方法

快捷键进入设置 CTRL+ ,搜索live serve 找到port 可以修改端口,但是没啥用.

因为别人的方法大部分没说要切工作区,你怎么改都没用

这里修改无用

3. 点到工作区

3.1点这里进setting.json编辑改完记得CTRL+S保存,

本次分享到次结束,留个关注呗

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

貂个小孩，解解蝉

关注关注

5
点赞
踩
7

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

解决grails服务端口冲突的办法(grails修改端口号)

09-04

grails中默认的服务端口为8080，当本机中需要同时启动两个不同的项目时，就会造成端口冲突,下面给出解决方法

vscode+live server——更改端口号——基础积累

yehaocheng520的博客

02-07

1万+

vscode+live server——更改端口号——基础积累

参与评论您还未登录，请先登录后发表或查看评论

配置调试工具LiveServer服务器参数

最新发布

qq_74629570的博客

09-22

343

配置LiveServer的默认端口、浏览器等

liveserver和vscode-preview-server修改端口

qq_40850266的博客

08-03

2056

vscode更改端口号

前端小菜鸟也有人起的博客

03-18

1625

vscode更改端口号

解决vscode插件Live Server默认端口号无法修改的问题

weixin_46166330的博客

10-31

3187

首先你先看看你的工作区有没有一个.vscode的文件夹，点开以后有一个setting.json的文件，没错就是它，点进去修改就OK了；但如果你发现你确实修改了，但是重新运行时依然还是原来的端口号，或者更甚的，一开始就直接不是5500，可能是5501、5502等等，先随便运行一个html文件，注意看右下角的数字，如果是5500，那么很大可能是默认的，很容易修改。找到这个以后，点进去，就可以改为你想要的，在重新运行html文件，你就可以看到修改成功了。先在你的扩展里找到Live Server插件=>扩展设置。

vscode的live server插件端口占用

woshiliyuwang的博客

08-01

1498

关于学习中，使用cscode插件的端口插件占用问题 vscode工具的强大，插件的丰富。使用起来方便，但作为新手会遇见各种问题，在使用live server帮助自动刷新的时候，经常会遇见使用失败然后收到这样的消息，这个时候我们只需要右键点击它就可以继续使用了 ...

vscode配置浏览器和Live Server

Liu_wen_wen的博客

09-24

4306

vscode配置浏览器和Live Server

实时更新Visual Studio Code工具与浏览器HTML修改同步更新-live-server的使用

07-16

- **自定义端口号**：可以通过编辑`.vscode/launch.json`文件来设置live_server使用的端口号。例如，如果希望使用8080端口，则可以在`launch.json`文件中添加如下配置： ```json { "version": "0.2.0", ...

vs-code中用liveServer打开vue-cli打包后的html，模拟查看线上路径问题

zzqz的博客

05-13

4749

首先在扩展搜索liveServer下载安装之后右键html就会出现liveServer命令我用的vue-cli版本是3.2，为防止路径问题，在vue.config.js中修改publicPath为 module.exports = { publicPath: "./" } 完成重新打包在vscode 配置 setting.json 中配置liveServer { "live...

VS Code+Live Server插件开发游戏并结合内网穿透分享好友异地访问

2401_84166672的博客

04-13

758

本篇教程，我们将通过VS Code实现远程开发MENJA小游戏，并通过cpolar内网穿透发布到公网，分享给无论身在何地的好友体验由你开发的游戏的乐趣。话不多说，下面就来教大家如何使用VS Code编写一个MENJA切块小游戏，这里我们使用VS Code并结合Live Server插件进行调试，Live Server可以实现一键安装，实现自动刷新，架设本地服务器环境。如何使用VS Code编写一个小游戏并结合内网穿透实现远程访问。

vue2学习笔记3 - 开发环境知识补充：live server简介

l_q_l的专栏

07-14

479

Live Server是一款方便的Web开发工具，可以在开发过程中提供实时预览和自动刷新的功能。无需手动刷新网页，开发者可以实时查看对代码的修改，并快速验证效果，但是不能用于部署最终站点。

VS Code 折腾记 - (13) VS Live Share (可提高效率的代码实时协作插件)的使用姿势

CRPER

05-17

1万+

前言这货憋了大半年.终于进入 beta 可用状态了….体验了一段时间后,该水文诞生了… 这货是什么,微软自家出的实时协作插件,什么是实时协作(有用过石墨文档或者腾讯文档的没?),差不多那样了对标 Atom的Teletype实时协作插件传送门: VS Live Share 预览版; 不说废话直入主题,目前这个是预览版,有些功能有些残缺也很正常…我也只扯我用到的; 一些特点 ...

简单记录下live-server使用

C_xran的博客

10-06

835

简单使用下liver-server

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

残阳曦月

06-02

1万+

vs code安装配置live server配置Browser浏览器、改Port端口号、改Host地址一、vs code扩展搜“Live Serve”，安装即可二、点击查看扩展，找到Live Server，点击【设置】按钮，选-【扩展设置】三、配置自定义（浏览器、Host、Port）1、配置默认浏览器打开2、配置修改Host地址为localhost（默认127.0.0.1）3、配置固定端口号为8080（默认为5500）一、vs code扩展搜“Live Serve”，安装即可二、点击查看扩展，找到Li

web服务器live-server教程

上班摸鱼随笔

05-16

914

一、安装需要安装nodejs及npm工具使用命令行全局安装```npm install -g live-server``` 二、使用在html文件夹下运行cmd命令```live-server```，默认端口号为```8080``` 如需自定义端口号则命令为```live-server --port=9090``` ...

live-server

weixin_28686261的博客

06-13

1917

这是一个具有实时重载功能的小型开发服务器。用它来热加载你的HTML / JavaScript / CSS文件，但不能用于部署最终的网站。安装使用 1、安装nodeJs 2、打开命令行工具，输入命令 npm install live-server -g 3、命令行进入项目文件中，输入命令 live-sever 启动注意事项输入命令 live-sever 启动，默认会自动打开浏览器，...

VS Code修改Live Server插件改变默认5500端口号以及项目运行时在URL上添加项目名称

热门推荐

luoyi-的博客

01-31

2万+

1、点击扩展，然后点击齿轮 2、点击配置信息 3、点击 “在settings.json中编辑” 4、点开默认应该只有第一条，我们添加第二条和第三条。即可修改项目运行时端口为8081。根路径加上 … 之后就是 vsCode所谓的工作区。也就是我们运行时url会显示工作区名称。 5、直接看效果吧，我描述的也不清楚。首先先看我项目情况没配之前url上没有项目名称配置了之后 ...

vscode-Live Server的使用心得

weixin_30835933的博客

08-06

9077

一，安装Live Server插件（不详细说明了）二，开启Server（服务）有四种方式：在窗口的最底部有Go Live可以点击，一旦点击，就会自动在浏览器中打开HTML文件在HTML文件中右键，然后点击open live server 快捷键(alt+L, O)打开服务 (alt+L, C)关闭服务按F1,然后在输入栏中输入Liv...

Live Server怎么用

09-03

### 回答1： Live Server 是一个用于本地开发的工具，它可以在你修改代码时自动刷新页面，让你更加高效地开发。使用 Live Server 很简单，只需要在 VS Code 中打开你的项目，然后点击 VS Code 右下角的“Go Live”按钮即可启动 Live Server。启动后，你的项目将在默认浏览器中打开，并且在你修改代码时会自动刷新页面。如果你想停止 Live Server，只需要点击 VS Code 右下角的“Stop”按钮即可。 ### 回答2： Live Server是一个用于开发前端网页的工具，可以提供实时预览和自动刷新功能。以下是使用Live Server的步骤： 1. 首先，在你的开发环境中，使用npm安装Live Server。可以在命令行中运行以下命令： ``` npm install -g live-server ``` 2. 在你的项目目录中，找到要预览的网页文件，通常是一个HTML文件。 3. 打开命令行，进入到该项目目录。 4. 运行以下命令来启动Live Server： ``` live-server ``` 5. Live Server会自动为该项目启动一个本地服务器，并且会显示一个网址，如`http://127.0.0.1:8080`。你可以在浏览器中打开该网址来查看你的网页。 6. 当你对网页文件进行任何更改时，Live Server会自动检测到并重新加载页面，以便你可以实时看到变化。 7. 你还可以在网页上右键单击，选择"Open with Live Server"来启动Live Server。请注意，Live Server只是一个本地开发服务器，用于开发和调试前端网页。它不适用于部署到实际的生产环境中。 ### 回答3： Live Server 是一个用于本地开发的插件，它可以在你保存文件时自动刷新浏览器，提供了一个实时预览的功能。使用 Live Server 可以极大地提高开发效率，以下是使用 Live Server 的步骤： 1. 首先，你需要在你的编辑器中安装 Live Server 插件。目前，Live Server 支持多个编辑器，比如 Visual Studio Code、Sublime Text、Atom 等。你可以在插件市场中搜索 "Live Server" 下载并安装它。 2. 安装完成后，在编辑器中打开你的项目文件夹。可以通过点击菜单栏中的 "文件" -> "打开文件夹" 或者使用快捷键来打开。 3. 打开项目文件夹后，在编辑器的左下方可以找到 Live Server 插件的图标（通常是一个圆圈里面有一个箭头），点击该图标启动 Live Server。 4. 在启动 Live Server 后，它会自动在你的默认浏览器中打开一个本地预览的网页，并且在你保存文件时会自动刷新网页以显示最新的更改。 5. 此时，你可以修改项目文件，比如 HTML、CSS、JavaScript 等，Live Server 会自动检测到文件的更改并刷新浏览器以呈现最新的效果。 6. 如果你想修改 Live Server 的一些设置，可以右击编辑器中的文件，然后选择 "在右边打开 Live Server 设置"，在其中可以更改端口号、主机名等相关设置。总的来说，使用 Live Server 很简便。只需简单几个步骤，你就可以实时预览你的项目，而不需要手动刷新浏览器。这对于开发过程中的调试和修改非常有帮助。