Array
University of Oregon
Browse: Home / Install Atom Packages

Install Atom Packages

(Mac Users: Atom has started prompting Mac users to install XCode Tools. Just Say No.)

Atom Set Up

When you launch Atom for the first time you get a Welcome screen. On this screen:

  • Uncheck: Show Welcome window, and
  • Check: No, I don’t want to help.

To change the default theme:

Open the Settings tab:  Atom > Preferences, click on the Themes tab, and choose the theme you want. You can also find and install new themes for Atom from the Settings View.

Install These Packages

Launch Atom, and open the Settings tab:

MacOS: Atom > Preferences
Windows: File > Settings

Click on the Install tab and type the name of the package into the search box under Install Packages.

Select your package from the search results, and click Install.

Search for each of these packages and install them. Use the exact spelling shown here.

Note: You will be prompted several times, Install Dependencies? Answer Yes to each prompt.

  1. atom-beautify.Beautifies HTML, CSS, JavaScript and beaucoup more.
  2. prettier-atom. Formats JavaScript.
  3. open-in-browser. Preview a web page (.html) in the browser.
  4. emmet. Essential toolkit for web-developers. The indescribable wow!
  5. base-linter (“A Base Linter with Cow Powers” from steelbrain).

    Base-linter, by default, lints your code as you type, which is highly intrusive. Set it to lint code when you save the file:

    1. Open the Settings tab and choose Packages  (Atom > Preferences > Packages), and search for linter.
    2. Click the Settings button, and uncheck “Lint as you type”.
  6. linter-jshint. JavaScript plugin for base-linter.
  7. linter-htmlhint (by AtomLinter). Lints HTML5 code.
  8. open-recent. Adds this option to the File menu
  9. Important:  After installing all the above packages, exit and restart Atom. You will be prompted several times, Install Dependencies? Answer Yes to all. Then exit and restart Atom one last time, for insurance.

Atom Tips

A. Always make this the first line of code in your .js files in Atom:
// jshint esversion: 6

B. Read Atom Basics to learn how to change Themes, configure Soft Wrap, and other useful tips.

FYI: the Atom Package Manager

The very first time you start Atom, it will try to install the atom and apm commands for use in the terminal (Mac) or Command Prompt (Windows). The Atom package manager can be used to install all packages at once:

Run this command in the Terminal (Mac) or Command Prompt (Windows):

apm install atom-beautify open-in-browser emmet open-recent 
base-linter linter-htmlhint toggle-quotes
Skip to toolbar