Skip to content
Latchkey

Prettier singleQuote and quoteProps

singleQuote makes Prettier prefer single quotes for strings; the default is double quotes.

Quote style is another one-line decision. Prettier still switches quotes when it avoids escaping, so the rule is "prefer", not "always".

What it does

singleQuote (default false) prefers single quotes for string literals. Prettier uses whichever quote requires fewer escapes, so a string containing a single quote may still come out double-quoted. jsxSingleQuote (default false) controls quotes in JSX attributes separately. quoteProps controls when object keys are quoted.

Common usage

.prettierrc.json
// .prettierrc.json
{
  "singleQuote": true,
  "jsxSingleQuote": false,
  "quoteProps": "as-needed"
}

Options

OptionWhat it does
singleQuote (default false)Prefer single quotes for strings
jsxSingleQuote (default false)Prefer single quotes in JSX attributes
quoteProps: as-needed (default)Quote object keys only when required
quoteProps: consistentQuote all keys if any key needs quoting
quoteProps: preserveKeep the quoting the author wrote

In CI

As with semi, align ESLint quotes rules with this setting via eslint-config-prettier or the tools will disagree in CI. Remember Prettier still flips quotes to minimize escapes, so do not expect every string to match the configured quote.

Common errors in CI

If CI flags strings you expected to be single-quoted, they probably contain an apostrophe, so Prettier kept them double to avoid escaping; this is correct behavior, not a bug. ESLint quotes errors after enabling singleQuote mean the stylistic ESLint rule is still active alongside Prettier.

Related guides

Run this faster and cheaper on Latchkey managed runners. Start free →