我的 Visual Studio Live 服务器扩展不能正常运行 function

Question

So recently I started using the live server extension on Visual Studio. The issue that I am having with it is that whenever I update my HTML or Javascript file, my CSS styling will no longer show on the browser, and I have to go to the CSS file and save it for them to show.

I have included some screenshots to try to explain my issue: So as you can see when I am on the app.css file, the correct styling is shown on the broswer. However when I go to my javascript or HTML file and add something then all the styling is removed.

I will appreciate it so much if someone could help me with my issue.

When I checked the chrome developer console for any error I found the following error:

Refused to apply style from ' http://127.0.0.1:5500/app.css/ ' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.

Answer 1

Check to make sure that whenever you open vs code, you select open folder and select your current project, and that your html,css, and js files all open then. When using live server(or at least on my machine), it will not work correctly unless the project is opened as a folder containing all of that projects files. I hope that makes sense and i hope that helps!