grady-lad / prettier-atom

An atom package for the prettier formatter.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Prettier for Atom Watch on GitHubStar on GitHubTweet

Version Downloads Build Status Code Coverage MIT License All Contributors PRs Welcome

Atom package to format your JavaScript, Typescript, CSS, Sass, and JSON using Prettier. Optionally integrates with ESLint, EditorConfig, and stylelint.

How to use it

After installation:

  • Enable 'format on save' to have prettier format your code upon saving
  • Run the command Prettier: Format to format your file manually
    • Windows/Linux: ctrl + alt + f
    • Mac: control + option + f
  • By default, formatting will use your prettier configuration. Otherwise it falls back to the prettier settings you chose in this plugin.

Demo

prettier demo

Installation

apm install prettier-atom

Or go to Settings β†’ Install and search for prettier-atom.

Make sure to restart Atom after the package is installed.

Detailed Usage

How to Format

There are two modes you can use:

  • Automatically format on save (requires enabling in Packages β†’ Prettier β†’ Toggle Format on Save)
  • Invoke manually using the keyboard shortcut (if no selection, whole file is formatted): CTRL + ALT + F

What Version of Prettier Gets used?

By default, we use the prettier instance in your project's 'node_modules' directory. If one isn't found, then we fall back to using the version that comes bundled with the prettier-atom package.

ESLint Integration

If you use ESLint, check the "ESLint Integration" checkbox and *poof*, everything should work (we use Kent Dodds's prettier-eslint plugin under the hood). We will recursively search up the file tree for your package.json and ESLint settings, and use them when formatting.

prettier-eslint demo

EditorConfig

Support is built into prettier. It derives prettier settings from your .editorconfig file and formats accordingly.

stylelint

stylelint is supported via prettier-stylelint. It derives prettier settings from your stylelint configuration and formats accordingly.

Questions?

More detailed descriptions of each option can be found in the Atom settings for this plugin.

Please open a pull request or file an issue if you notice bugs or something doesn't work as it should!

Troubleshooting

If Prettier (or prettier-eslint, if ESLint integration is enabled) is not formatting something properly, please open an issue on the relevant GitHub repository. This package is only integrating those projects to be used in Atom.

Inspiration

This repository was created by James Long to go along with his Prettier project. Kent C. Dodds extended Prettier to add eslint --fix integration as prettier-eslint and forked the original prettier-atom plugin to create the prettier-eslint-atom plugin. Because it became clear that the plugins were very similar and thus maintenance made easier by combining the two, Rob Wise merged prettier-eslint-atom back into prettier-atom.

Maintainers

Rob Wise

Contributors

Thanks goes to these people (emoji key):


James Long

πŸ’¬ πŸ’» πŸ“– πŸ”Œ πŸ‘€

Rob Wise

πŸ’» πŸ“– πŸ’¬ πŸ’‘ πŸ‘€ ⚠️

Kent C. Dodds

πŸ’» πŸ“– πŸš‡

Luca Barone


Arnar Þór Sveinsson

πŸ’»

Adam Miskiewicz

πŸ’»

Ori Livni

πŸ’»

Leon Chen

πŸ’»

Christopher Chedeau

πŸ’¬ πŸ’» πŸ”Œ

Christoph Geschwind

πŸ’»

Andrew Hutchings

πŸ’»

David Schnurr

πŸ’»

Ryan Cole

πŸ’»

Dara Hak

πŸ’» πŸ“–

Stephen John Sorensen

πŸ’»

Lukas Geiger

πŸ’» ⚠️

Viktor Charypar

πŸ’» ⚠️

Mats HΓΆgberg

πŸ’»

Roman

πŸ’»

vaibhav

πŸ’»

Karl Horky

πŸ’»

Dan Abramov

πŸ’»

Murphy Randle

πŸ’» πŸ›

Matthieu Lemoine

πŸ’»

Ron Green

πŸ’»

Harold Treen

πŸ› πŸ’»

Nikita Mashukov

πŸ’»

Sam Horton

πŸ’» ⚠️

olsonpm

πŸ’»

This project follows the all-contributors specification. Contributions of any kind are welcome!

LICENSE

MIT

About

An atom package for the prettier formatter.

License:MIT License


Languages

Language:JavaScript 99.6%Language:CSS 0.4%