简体   繁体   English

在 Visual Studio 代码的实时服务器扩展中,在哪里设置 liveServer.settings.port 的值

[英]Where to set value of liveServer.settings.port in live server extension of visual studio code

I am working on Angular7 with visual studio code editor URL: http://localhost:4200 (Working fine)我正在使用 Visual Studio 代码编辑器 URL 处理 Angular7: http://localhost:4200 (工作正常)

But, I installed extension Live Server and when I click on Liveserver icon its giving me the error但是,我安装了扩展Live Server ,当我点击 Liveserver 图标时,它给了我错误

"Error on port 5500. Please try to change the port through settings or report on GitHub." “端口 5500 错误。请尝试通过设置更改端口或在 GitHub 上报告。”

So, I opened the File->preference->Settings->LiveServerConfig and tried to change port in settings.json file所以,我打开了File->preference->Settings->LiveServerConfig并尝试更改 settings.json 文件中的端口

{
    "typescript.tsdk": "./node_modules/typescript/lib",
    "tslint.enable": false,
    "liveServer.settings.multiRootWorkspaceName": "QiwkCollaboratorTool",
    "liveServer.settings.root": 0  // New added line
}

Am I going into right direction or am I missing something ?我是朝着正确的方向前进还是遗漏了什么? I am not sure how to change the port number 5500 to 0 as I want random port number.我不知道如何将端口号 5500 更改为 0,因为我想要随机端口号。

Thanks in advance!提前致谢!

I got the answer I was editing the wrong settings.json there were two .json files.我得到的答案是我正在编辑错误的 settings.json 有两个 .json 文件。

在此处输入图片说明

Also, I put the below code:另外,我把下面的代码:

{
    "liveServer.settings.multiRootWorkspaceName": "",
    "liveServer.settings.port": 0
}

But thanks Danny但是谢谢丹尼

I hope this helps: in the settings.json add the following line.我希望这会有所帮助:在 settings.json 中添加以下行。

"liveServer.settings.port": 0,

A value 0 (zero) is used for a random port.值 0(零)用于随机端口。 Any other numbers is for a fixed port number.任何其他数字都用于固定端口号。

Solution解决方案

  1. First,navigate to Settings (Ctrl+Comma) .首先,导航到Settings (Ctrl+逗号) Screenshot截屏
  2. Now click on Extensions , which is located on the left side of the window.现在单击位于窗口左侧的Extensions Screenshot截屏
  3. After that scroll down and find a tab by the name of Live Server Config之后向下滚动并找到一个名为Live Server Config的选项卡
  4. Click on that, scroll down, now click on Edit in settings.json under Settings: Port .点击那个,向下滚动,现在点击Settings: Port Edit in settings.json Settings: Port Screenshot截屏
  5. A new window will pop up.将弹出一个新窗口。 here you go, now you can change the port number.好了,现在您可以更改端口号了。 Screenshot截屏
  6. At the end save the file Ctrl+s .最后保存文件Ctrl+s

liveServer.settings.port: Customize Port Number of your Live Server. liveServer.settings.port:自定义 Live Server 的端口号。 If you want random port number, set it as 0.如果需要随机端口号,请将其设置为 0。

Follow these steps to change port of Live Server in VS Code:按照以下步骤在 VS Code 中更改 Live Server 的端口:

  1. Step 1 .第 1 步 Open up VS Code.打开 VS 代码。

  2. Step 2. Use Ctrl+Shift+I Shortcut key to open up Extensions (on the left side).步骤 2.使用 Ctrl+Shift+I 快捷键打开扩展(在左侧)。

  3. Step 3. Find out the live server extension, then click on the gear icon at the bottom of it, and open up Extension Settings.步骤 3.找出实时服务器扩展,然后单击它底部的齿轮图标,然后打开扩展设置。

  4. Step 4. Here, find out, Live Server > Settings: Port, under this, click on Edit in settings.json.第 4 步。在这里,找到 Live Server > Settings: Port,在此之下,单击 settings.json 中的 Edit。

  5. Step 5. Here, set the port on which you wanna open up live server (set value to 0 for random ports).第 5 步。在这里,设置您要打开实时服务器的端口(将值设置为 0 随机端口)。

  6. Step 6. Now, click ctrl+s to save the file.步骤 6。现在,单击ctrl+s保存文件。

After this, you can test it by opening any file using live server.在此之后,您可以通过使用实时服务器打开任何文件来测试它。

Source: Fix: Server is Started at Port 5500 Live Server来源: 修复:服务器在端口 5500 Live Server 上启动

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM