NPM live-server无法加载项目网站，仅显示目录列表求助

架构老林

2026-5-29

Troubleshooting live-server showing directory listing instead of your site

Hey there! I totally get how confusing this is when you're new to npm and live-server—let's work through this together to get your site loading properly. Here are the most common fixes to check:

Ensure you have an index.html file in your project root
Live-server automatically looks for index.html as the default "homepage" for your site. If your main HTML file has a different name (like main.html or home.html), it won't know to load it and will just show the directory listing instead.
Quick fixes:
- Rename your main HTML file to index.html
- Or specify the file directly when running the command: live-server your-custom-filename.html
Double-check your terminal's working directory
If you ran live-server from a folder that's above your project root (like your Documents folder instead of your actual website folder), it'll list the contents of that parent folder instead of launching your site.
Fix: Use the cd command to navigate to your project's root first. For example:
```
cd ~/Projects/my-new-website
live-server
```
Verify your live-server installation method
If you installed live-server locally (without the -g flag), typing just live-server won't recognize the command. You need to use npx to run the local version.
Fixes:
- Try running npx live-server instead
- If you want to use it globally (so you can just type live-server anywhere), reinstall it with:
```
npm install -g live-server
```
  (Note: On macOS/Linux you might need to add sudo before this command, or run Command Prompt as Administrator on Windows.)
Check if your HTML file is in a subfolder
If your site's files are nested inside a folder like src, public, or dist, live-server won't automatically dig into that folder. You need to point it directly to the subfolder.
Fix: Run live-server src (replace src with your actual subfolder name) and it'll load the index.html inside that directory.