Why is VS code live server opening a directory instead of running the code in the browser?

Question

I am using VS code for react. I have the live server extension installed, whenever I try to go live with VS code it shows me a listing directory with all of my folders and files in the browser instead of running my app. Any clue as to why it does this?

Solution 1

You need to provide 'index.html' file in exposed directory. It has to be named exactly like this.('index.html')

More info: https://webmasters.stackexchange.com/questions/30234/the-right-way-of-using-index-html

Solution 2

Just had this error, you have to open the folder using "open folder". It'll be in the editor panel now. And when you go live it takes you to whatever is in the editor panel.

Solution 3

LiveServer will load the file within the folder in the WORKSPACE assigned to it.

So point to the correct folder and more important, CLOSE active WorkSpaces already opened with LiveServer.

So... Open the Explorer on VSC and close any open "Workspaces" (save your work)

Target the correct index.html file in a new Workspace.

Once it points to the right file then simply right-click and select "open with LiveServer."

It should work.

Solution 4

You should have a dedicated folder for the file(index.html) to run the code directly in the browser from VS code Live Server.

View more solutions