Trying to use live server package on text editor atom

5.7k views Asked by At

I am trying to use the live server package which works pretty much like livereload for editor Atom. The server runs fine, but the files do not get automatically refreshed whenever I make changes + save the files..

Not sure if this is normal, but when I open up the server on the browser, I am forwarded to a directory with all the files on the server. How do I change this so that the server renders HTML only and refreshes every time changes are made?

4

There are 4 answers

0
Oct699 On

My php files with html elements dont open, so create the file like .html files, and everythings runs well. Use .atom-live-server.json on the root project to change some options like other browsers.

Edit 1: Have the solution ! 1- Install Live Reload from livereload.com. 2- Install Live Reload from browser extension. 3- Copy and paste this before before body:

<script>document.write('<script src="http://' + (location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1"></' + 'script>')</script>

4- Execute live reload and the browser and still works for php files.

0
Madivad On

You haven't set the project folder for the live-server to operate from, or you've saved the file you want to view outside of where it is running from.

In the project window on the left, add the project folder that you are using, and remove anything else. Or save your file in that location.

0
pyfyc On

I had the same problem with atom-live-server and Google Chrome browser. Finally made it work using these steps:

  1. Open your Browser
  2. In Project pane open the project folder that you want to test
  3. Start the atom-live-server
  4. It should automatically open a new page in your browser. Right click on it and select Inspect -> it will open Console window.
  5. Your Live reload is enabled. Notice the message in the Console.

After you make changes in your javascript or html in Atom save your changes (Ctrl + S) and the browser page will be updated.

enter image description here

1
beetle442002 On

I fixed it by adding the <head> and <body> tags to the html file I was editing. (even though I don't always include them anymore at least one is needed for the "Live reload" server to work.)

Live reload won't work unless there's a tag in the HTML the script can be injected on (body, head, and svg).

see this github issue!