.prerrierrc
This is my personal preference for Prettier settings for React applications.
{
"trailingComma": "es5",
"tabWidth": 4,
"semi": false,
"singleQuote": true,
"printWidth": 160
}
Other Commonly Used Configuration Options
Here’s a handy rundown of commonly chosen options that are often used in various configurations.
singleQuote:
Default: false
Options: true or false
Specifies whether to use single or double quotes for string literals in JavaScript code.
tabWidth:
Default: 2
Options: Any positive integer
Specifies the number of spaces per indentation level in JavaScript files.
semi:
Default: true
Options: true or false
Controls whether semicolons are added at the end of JavaScript statements.
arrowParens:
Default: “always”
Options: “always”, “avoid”, “avoid-all”, or “avoid-except-singleton”
Controls whether parentheses are added around arrow function parameters.
bracketSpacing:
Default: true
Options: true or false
Controls whether spaces are added inside object literals.
jsxSingleQuote:
Default: false
Options: true or false
Specifies whether to use single or double quotes for JSX attribute values.
jsxBracketSameLine:
Default: false
Options: true or false
Controls whether JSX closing brackets are placed on the same line as the last JSX element.
quoteProps:
Default: “as-needed”
Options: “as-needed”, “consistent”, or “preserve”
Controls whether object property names are quoted.
trailingComma:
Default: “none”
Options: “none”, “es5”, or “all”
Controls whether to add trailing commas in arrays and objects.
useTabs:
Default: false
Options: true or false
Controls whether to use tabs for indentation.
endOfLine:
Default: “auto”
Options: “auto”, “lf”, or “crlf”
Specifies the end of line characters.
printWidth:
Default: 80
Options: Any positive integer
Specifies the maximum line width.
quote:
Default: “single”
Options: “single” or “double”
Specifies whether to use single or double quotes for string literals.