Live server not rendering

HTML-CSS
1

Hi,

I’m trying to teach myself how to code in HTML and CSS using Visual Studio Code. Unfortunately I’ve already come across my first very basic problem. When I try to open up live browser the code that I have done isn’t showing on the browser. I’m expecting to see my title in the top tab but its still just showing numbers. It seems to open up in safari if that makes any difference?

Would be very grateful if a more knowledgable person could shed some light on what my issue might be.

Many thanks

2

Hi there,

please tell us which live-server you installed and how you try to run it.

Do you see a message in the bottom right corner after starting it, e.g. Port: 5000?

3

Hi. Thanks for responding. As far as the live server that i installed…The only info i can see is that it says V5.7.4. (That prob doesn’t tell you very much)

I don’t get any message in the bottom right corner. All that appears is a completely blank screen, opened in safari, with a tab that says 127.0.0.1.

4

Just checked live server settings in VSC and the default browser was set to null. Thought it might be that so i switched default to chrome, but its still not showing, annoyingly.

5

Alright, this should be Live Server by ritwickdey.

  1. Open a HTML-file in VSCode.
  2. Go to the bottom right corner and click Go Live:
    2022-02-08_07-43
    After some seconds it should show Port: 5500 (or any other number):
    2022-02-08_07-43_1
  3. Then you should be able to go to the local URL: http://127.0.0.1:5500/ in your browser. (5500 is the port number you can see in VSCode)

If this doesn’t work, at which step does it differ from my flow?

If it works as expected:
If you open the browser and still can’t see anything, do a right-click on the site and search for an entry like View page source (naming differs from browser to browser).

Does this show the HTML code from your HTML-file?

6

Hi. I’ve followed the steps. After finding the entry ‘View source code’ on the blank web page that opens it does have my HTML code, but it also has a load of other code too. I’ll try and send screen shot

7

Screenshot 2022-02-08 at 12.01.25
Screenshot 2022-02-08 at 12.01.251440×900 116 KB

8

Im not really sure, but are you using any external js scripts too including libraries, frameworks and the like? Also is the code bug-free? Does anything show up on the console ?

When I used to try to make Live Server render React or three js , it just wouldnt. I suggest trying something like vitejs instead of live server.

9

Hi, Thanks for the help. I don’t think i have any external js scripts being used. How would I check if the code was bug free?

So far I have opened the command pallete and checked the preferences of the open settings (JSON) to see if the default browser I had had was the same as what was opening up and it was what i changed it to which was chrome. Its annoying as I know this is prob something really simple but because i have basically no coding experience and i’m trying to teach myself I’m stumped.

10

Ok, so I’ve attempted to copy and paste some lines of code into my VSC editor and tried live server and it has transferred over to live server fine, so the issue lies with how i was typing the code it looks like.

11

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.