Почему не работает live server в vs code

Live Server — It’s a very pleasent extension for all the web developers over there. It helps to open up your project in browser with in a click, and automatically reloads the browser tab, as you save you work.

This tool is a must for those who love to code on Visual Studio Code. Moreover, many of them might only be using VS Code due to this awesome extension.

But here’s a catch, it sometimes can also give some awful errors or just don’t work, making the whole coding exprience worst. But don’t worry, today we will see — How to fix Live Server in Visual Studio Code?

So let’s get started!

(Watch Video: Video is available at the end of this article)

Restart VS Code

Sometimes your Visual Studio Code might stop working for a while due to a whole bunch of commands given by you at once, which might not be easier for it to execute at the moment.

In such cases, only re-starting the program can be very useful. This will let your VS Code refresh itself and start again.

So, firstly save your project work. Then, close and re-open VS Code. If this works then it’s great, else follow along the next method!

Set the default browser

If you hasn’t set any default browser of your Operating System (OS) or it has just messed up with the location of the program, then your Live Server won’t be able to know which one browser it should open.

So, follow the following steps to set the default browser:

Step 1. Use Win + I shortcut command to open up the settings.
Step 2. Now, navigate to Apps & Features.
Step 3. Then, click on Default apps on the left side.
Step 4. Scroll down the list, and choose Web browser.
Step 5. Then, select the browser that suits you the best.

Set the browser

By telling Live Server that which browser it should open, you can also solve this problem.

Follow the following steps to set the default browser in VS Code:

Step 1. Press F1 key to open up the Command Pallete.
Step 2. Search for, Preferences: Open Settings (JSON), and open it up.
Step 3. At the end of the last setting, put a comma(,) and paste this:

Manually Open Live Server

If your Live Server don’t opens up the browser tab on giving command, there might be some minimal issue with your Live Server.

So, you can otherwise try opening up the following link manually in browser: http://127.0.0.1:5500/<filesname>

Here, change the <filesname> to your prefered file location. For example: http://127.0.0.1:5500/index.html

If it works then it’s great, this means that there was only some problem while opening up your browser, and your Live Server still works effectively.

Error: Server is started. but failed to open in Browser Preview

If you are the one who’s getting this type of error, shortly after trying to run the Live Server, then this problem can be solved by doing some changes in the settings.

[Fix] VS Code Live Server Not Working

This tool is a must for those who love to code on Visual Studio Code. Moreover, many of them might only be using VS Code due to this awesome extension.

So let’s get started!

(Watch Video: Video is available at the end of this article)

Restart VS Code

Sometimes your Visual Studio Code might stop working for a while due to a whole bunch of commands given by you at once, which might not be easier for it to execute at the moment.

In such cases, only re-starting the program can be very useful. This will let your VS Code refresh itself and start again.

So, firstly save your project work. Then, close and re-open VS Code. If this works then it’s great, else follow along the next method!

Set default browser (System)

So, follow the following steps to set the default browser:

Step 1. Use Win + I shortcut command to open up the settings.
Step 2. Now, navigate to Apps & Features.
Step 3. Then, click on Default apps on the left side.
Step 4. Scroll down the list, and choose Web browser.
Step 5. Then, select the browser that suits you the best.

Set default browser (VS Code)

By telling Live Server that which browser it should open, you can also solve this problem.

Follow the following steps to set the default browser in VS Code:

Step 1. Press F1 key to open up the Command Pallete.
Step 2. Search for, Preferences: Open Settings (JSON), and open it up.
Step 3. At the end of the last setting, put a comma(,) and paste this:

Manually Open Live Server

If your Live Server don’t opens up the browser tab on giving command, there might be some minimal issue with your Live Server.

So, you can otherwise try opening up the following link manually in browser: http://127.0.0.1:5500/<filesname>

Here, change the <filesname> to your prefered file location. For example: http://127.0.0.1:5500/index.html

If it works then it’s great, this means that there was only some problem while opening up your browser, and your Live Server still works effectively.

Error: Server is started. but failed to open in Browser Preview

If you are the one who’s getting this type of error, shortly after trying to run the Live Server, then this problem can be solved by doing some changes in the settings.

«Go Live» is no displayed. #160

«Go Live» is no displayed.
Since it was displayed until a few days ago, was there any change in version upgrade?

The «Open with Live Server» command displays an entry field but has no guidance as to what to enter.

live server version 5.0.0

The text was updated successfully, but these errors were encountered:

Entering the «http://localhost:5050/» in the «Open with Live Server» command will cause a long error on the development tool’s console.
I guess this is only because I do not understand how to use this command.

console.ts:136 [Extension Host] WARNING: Promise with no error callback:5
log.ts:171 ERR Cannot read property ‘uri’ of undefined: TypeError: Cannot read property ‘uri’ of undefined
at setOrChangeWorkspace.then.workspaceName (C:\Users\USERNAME.vscode\extensions\ritwickdey.liveserver-5.0.0\out\src\workspaceResolver.js:46:86)
at Object.g [as _notify] (c:\Program Files\Microsoft VS Code\resources\app\out\vs\workbench\node\extensionHostProcess.js:76:971)
.
I will skip it because it is so long.

I do not know the reason why the «Go Live» button is not displayed.
It is displayed automatically while editing HTML files, right?

Sorry, Because I do not understand English, this sentence was translated by Goole.

Live server installed but not working in VS code

I have installed the live server extension but the browser does not update after I save my HTML or other files. What might be causing a problem?

24 Answers 24

I had this problem and I solved it by changing the port number in the settings.json file to an opened one.

To get to the settings.json file you just click CTRL + SHIFT + P , then type "settings", click the "Preferences: Open Settings (JSON)", then paste this inside the < >:

This will randomly pick an opened port each time. This is how my JSON file looks like:

If there are multiple lines in the JSON file, make sure each line is separated by a comma( , ), like this:

Re-install the extension and restart your text editor to fix the issue.

I have gone through many solutions and picked few combinations and all of a sudden it worked. So here are the steps:

Go to system environment variables > system variables > click on path > edit > add new path line : C:\Windows\System32 > apply it and close.

Now open VS Code and (re-)install Live Server.

Go to extension settings of Live Server.

Click on "Edit in settings.json" and add below statements:

"liveServer.settings.root": "/", "liveServer.settings.port": 63404, (this port number varies) Now go back to extension settings again and scroll down to set Live Server Custom Browser. Choose Null from the dropdown.

Note: These points all together solved my issue and may not work or work for others.

If live server is not runnning and rendering html page on port 5500,for example http://127.0.0.1:5500/index.html not working.

Then this may be due to connection issue on your system.

I had same problem when i was compiling below html page:

Solved it by changing live server settings to my local IP and it fixed issue.

My local ip: http://192.168.2.16:5500/index.html is rendering changes on fly and working.

This works for anyone for whom live server is not running by default with port 5500.

It is because you have added insufficient paths in your Environmental variables.

First you can do is close the vs code

Go to the properties of My Pc

Click on Advanced Settings

click on Environmental Variables

from there you can add path clicking the path variables in the table shown there 6 . Add a new line to the path and copy paste the path of your system 32

hope this solution works in your case

Live server started but still isn’t opening the page in your browser automatically

Note: some time port number 5500 will be changed to 5501

I had a space in the file name, where the index.html was to be found.
Like: 3. Typography .
Just got rid of the space: 3.Typography because (of course) we can not have empty spaces in a url.

its easy to solve. just open setting by (ctrl + ,)and pick commonly Used first field is a (Auto save) Its value is by default off you must change it to After delay

Please use the proper HTML syntax which is ��

Being a newbie to web development, I was only using the head tag . The web page was working in the browser but the live server couldn’t process it. You can get the above snippet in vscode by typing html:5 and then hitting tab.

Also, make sure that the autosave feature in vscode is enabled, which you can do by going to vscode settings shortcut : Ctrl + , and then type autosave. Change Files: Auto Save to afterDelay and if you want to view the changes in your code instatenously, edit Files: Auto Save Delay to 1 .

Now sit back and watch the magic happen��.

I was using this in a folder and folder’s name has some irregular letters like capital i "İ". When I chance the folder’s name to suits english rules it works.

This is happening because you have changed some default settings. You should reset them all to run the live server. Unless you should define what did you change to the live server.

If the live server still not working,

Make sure you have embedded your folder to VS code. If you didn’t just press Ctrl + B and Click on the Add New Folder Icon. Then choose your project’s folder. Then right-click on your project.html and it will open.

If didn’t work, type in the Address bar in your browser like 127.0.0.1:5500. Localhost server should open now.

Still, you had the problem, they try to close and reopen VS code several times.

If still, you got the problem, try to install your default web browser in the default path in your C drive. (C://Program files. )

If you still have the problem it might be a problem with the live server. You should uninstall it and install another version outed lately.

Почему не работает live server в vs code