When I try to use the “Open with Live Server” link in VS Code, it produces a display of a directory listing, specifically the subdirectory that contains .jpg image files. This is true no matter what html file I have open in VS Code, including the index.html file.
Searching online says that this is caused by not having an index.html file; however, there is an index.html file in the same path as the file open in VS Code. I can click on the file name of other html files in the same path and they open in a chrome browser window.
There must be another answer than ‘not having and index.html’ file present.
It sounds like your project has not coded the default page directory of the “live server” correctly, and is expecting an “index.html” in the images directory because it thinks the image directory is the main file directory.
I’m guessing that you are referring to a setting for VS Code. If so, can you offer pointers on how to do what you suggest? I don’t recall having done anything in VSCode in the past; yet the Open with Live Server worked perfectly, opening in Chrome which is set in the Live Server settings as the default.
There are so many options in VS Code that I’m overwhelmed by their number not to mention my ignorance about what they mean.
Thats odd. If your liveServer settings root is “/”, it should be using whatever your workspace is as the root, and if you opened the Folder using Open Folder to make your workspace root the folder with index.html in it, It should have made that the workspace root…
Can you show us what the left side (the Explorer dock) looks like?
I kept searching and reading answer to the question of why VS Code Live Server displays a directory. Apparently this has happened to a lot of people over the years. Different solutions have worked for different people, but none of them worked for me.
One seemingly credible (because it was more thorough) post suggested reinstalling VS Code then the extenstion. I downloaded a fresh copy of VS Code then uninstalled the old copy via Windows Settings > Apps. When I try to install the freshly downloaded copy of VS Code for Windows 11, I got this message:
I finally got Live Server to work. Although the VSC Explorer window showed that my index file had been opened along with other html files in the same directory, there was some issue. Perhaps I had not opened the folder first but had opened the files directly. I don’t know; I’m only speculating. In any case, I closed all the open files in VSC and went back to the folder I use for staging FTP uploads. I chose that folder and opened it. I then opened all the files in the folder including 3 html files and my css file. I could then choose an html file from the VSC Explorer list, right-click and choose open with Live Server. That gives me the browser display of the file chosen.
I did this after uninstalling all vestiges of VS Code from my system and downloading a fresh copy from the Microsoft store insteading of the link given by searching for “VS Code Download.” I then reinstalled it before making the changes described in the paragraph above.
It’s unclear to me which change worked, but I suspect that it was opening a folder afresh then opening the files therein.
I’m posting in case someone else is searching here with the directory listing problem.