What is prettier?
Prettier is an opinionated code formatter that supports many languages and integrates with most editors. It removes all original styling and ensures that all outputted code conforms to a consistent style.
What are prettier's main functionalities?
Code Formatting
Formats all .js files in the src directory and its subdirectories. When run, this command will process each JavaScript file and reformat it according to Prettier's rules.
prettier --write 'src/**/*.js'
Configuration Overrides
Allows customization of Prettier's default formatting rules. For example, this JSON configuration disables semicolons at the end of statements and enforces single quotes.
{
'semi': false,
'singleQuote': true
}
Ignoring Code
You can prevent a section of code from being formatted by Prettier by adding a special comment, `// prettier-ignore`, before it.
// prettier-ignore
let untouched = 'This code will not be formatted by Prettier.';
Integration with Editors
Prettier can be integrated into many code editors to automatically format files on save or during editing, enhancing the developer's workflow.
N/A
Support for Multiple Languages
Prettier supports a wide range of languages and frameworks, including but not limited to JavaScript, TypeScript, CSS, HTML, and Markdown, making it a versatile tool for many developers.
N/A
Other packages similar to prettier
eslint
ESLint is a tool for identifying and reporting on patterns found in ECMAScript/JavaScript code, with the ability to fix many issues automatically. While it can also format code, its primary focus is on code quality and adherence to coding standards, unlike Prettier which is solely focused on code formatting.
stylelint
Stylelint is a modern linter that helps you avoid errors and enforce conventions in your stylesheets. It is to CSS what ESLint is to JavaScript, and while it can fix code style issues, it is more focused on maintaining code quality rather than just formatting.
beautify
Beautify, available as 'js-beautify' for npm, is a code beautifier that can format HTML, CSS, and JavaScript. It is less opinionated than Prettier and offers more configuration options, but it might not enforce as consistent a style as Prettier does.
standard
Standard is a JavaScript style guide, linter, and formatter that enforces a strict coding standard. Unlike Prettier, Standard also includes rules that aim to prevent bugs and improve code clarity.
Opinionated Code Formatter
JavaScript
· TypeScript
· Flow
· JSX
· JSON
CSS
· SCSS
· Less
HTML
· Vue
· Angular
GraphQL
· Markdown
· YAML
Your favorite language?
Intro
Prettier is an opinionated code formatter. It enforces a consistent style by parsing your code and re-printing it with its own rules that take the maximum line length into account, wrapping code when necessary.
Input
foo(reallyLongArg(), omgSoManyParameters(), IShouldRefactorThis(), isThereSeriouslyAnotherOne());
Output
foo(
reallyLongArg(),
omgSoManyParameters(),
IShouldRefactorThis(),
isThereSeriouslyAnotherOne(),
);
Prettier can be run in your editor on-save, in a pre-commit hook, or in CI environments to ensure your codebase has a consistent style without devs ever having to post a nit-picky comment on a code review ever again!
Documentation
Install ·
Options ·
CLI ·
API
Playground
Badge
Show the world you're using Prettier →
[![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier)
Contributing
See CONTRIBUTING.md.