Atom editor is a “A hackable text editor for the 21st Century” built by GitHub. If you use it as your editor of choice, the design systems team has a list of packages that we find useful for CSS development.
We keep a list of suggested packages in our atom-packages repository. To install all packages, run this command in your terminal.
apm install $(curl -L https://raw.githubusercontent.com/primer/atom-packages/master/packages)
The Autocomplete Primer package is a custom Primer package that autocompletes class names for utilities and Rails helper tags for Octicons.
Install autocomplete-primer using Atom’s package manager or enter this into your terminal:
apm install autocomplete-primer
Color picker adds a color picking overlay with sliders and color wheels.
Install color-picker using Atom’s package manager or enter this into your terminal:
apm install color-picker
Pigments adds corresponding backgrounds to CSS color values in the editor for higher visibility. It also scans the source files for color variables and displays the true value.
Install pigments using Atom’s package manager or enter this into your terminal:
apm install pigments
We use Stylelint, an extension to the Atom linter package, for linting our SCSS. To prevent linting errors during the build we recommend you install linter-stylelint, which will alert you of any errors locally while you work.
Install linter-stylelint using Atom’s package manager or enter this into your terminal:
apm install linter linter-stylelint