Live server

Hello atom community I write to see if someone can help me with the atom live server plugins. Is there any way to access the preview with some icon in the lower claw of atom or do you have to access packages and search for atom live server?

I can offer some tips to customise workflow but I am writing as a Ubuntu user.

Why do posters not clarify their work environment (Windows/Linux/Mac) to help contributors respond?

I would start by understanding the options available in apm command.

Run in terminal: apm --help to see the many options.

For example run the command: apm list to see what packages you have installed.

You can install, uninstall, disable packages while you experiment with creating the optimum workflow. The end mix of packages will be a personal choice.

Of course packages can be researched through packages directory.

Search “browser” and “server” separately to see the different flavours. Look at the number of downloads of different packages. Some have even been abandoned over time.

You mention atom-server package which does indeed preview HTML but my personal choice is php-server (which applies to both HTML and PHP), My reason is that php-server offers more error reporting in Atom when the server is launched (for example listing broken file paths).

I can search using a grep filter to find which packages have “server” in their name and I have this.

➜ ~ apm list | grep server
├── atom-live-server@2.3.0
├── php-server@0.8.0

Finally if you are looking for some button to launch the preview package there are a number of methods other than referring to menu dropdown. I agree that looking through long menu lists under packages is not ideal and I prefer to single out a short list of workflow commands to place in Atom top menu bar.

As an example go to top bar Edit > Init Script …
and add at bottom …

atom.menu.add [
    {
      label: 'Commands'
      submenu : [{label: 'Toggle Command Palette', command: 'command-palette:toggle'}]
    }
  ]

A new entry “Commands” will be placed in your top bar.

You can expand this approach by creating a custom set of commands. I have another as follows which launches a custom command in process-palette.

atom.menu.add [
    {
      label: 'Actions'
      submenu : [{label: 'Atom Actions', command: 'process-palette:atom-actions'}]
    }
  ]

To conclude, you might have a custom button “Preview” which launches your chosen preview package.