How to tell eslint that you prefer single quotes around your strings

Question

I'm new to eslint and it's spewing out a ton of errors telling me to use doublequotes:

error  Strings must use doublequote

That's not my preference. I've got an .eslintrc file set up with the basics:

{
  "env": {
    "node": 1
  }
}

I'd like to configure it for single quotes.

score 121 · Answer 1 · edited Sep 23 '16 at 21:20

121

http://eslint.org/docs/rules/quotes.html

{
  "env": {
    "node": 1
  },
  "rules": {
    "quotes": [2, "single", { "avoidEscape": true }]
  }
}

edited Sep 23 '16 at 21:20

Knu

14,806
5
56
89

answered Mar 28 '15 at 02:21

Antonius Bloch

2,311
2
14
14

16

If I need to use either of single or double quotes, what to change in above rule ? – vikramvi Mar 07 '19 at 09:36
3

@Antonius Bloch, this solution doesn't work in my Vue.js project... `"eslintConfig": { "root": true, "env": { "node": true }, "extends": [ "plugin:vue/essential", "@vue/prettier" ], "rules": { "no-console": "off", "quotes": [1, "single", { "avoidEscape": true }] },` – Riko3412 Dec 28 '19 at 13:00
2

What is the `2` for? I can't see any explanation in that link. – ryan2johnson9 Dec 07 '21 at 03:07
4

@ryan2johnson9 It is a rule severity level: 0 = off, 1 = warn, 2 = error – Dmitry Barskov Jan 12 '22 at 20:55

mtpultz · Answer 2 · 2021-09-18T19:06:11.513

50

If you're using TypeScript/ES6 you might want to include template literals (backticks). This rule prefers single quotes, and allows template literals.

TypeScript Examples

"@typescript-eslint/quotes": [
  "error",
  "single",
  {
    "allowTemplateLiterals": true
  }
]

Another useful option is to allow single or double quotes as long as the string contains an escapable quote like "lorem ipsum 'donor' eta" or 'lorem ipsum "donor" eta'.

"@typescript-eslint/quotes": [
  "error",
  "single",
  {
    "avoidEscape": true,
    "allowTemplateLiterals": true
  }
]

References:

ESLint

https://eslint.org/docs/rules/quotes

TypeScript ESLint

https://github.com/typescript-eslint/typescript-eslint/blob/master/packages/eslint-plugin/docs/rules/quotes.md

edited Sep 18 '21 at 19:06

answered Mar 15 '21 at 07:47

mtpultz

17,267
22
122
201

2

I don't think you need to set `allowTemplateLiterals` to `true` unless you want to allow using template literal strings even when only single quotes would work. Template literals are allowed by default. This can easily be tested. – oyalhi Sep 17 '21 at 17:06
both examples in the post are exactly the same showing example for `allowTemplateLiterals`, very confusing. Downvoting until fixed. – oyalhi Sep 17 '21 at 17:07
1

@oyalhi yep somehow missed `avoidEscape`. Thanks – mtpultz Sep 18 '21 at 19:06

score 25 · Answer 3 · answered Mar 02 '21 at 12:04

25

rules: {
  'prettier/prettier': [
    'warn',
    {
      singleQuote: true,
      semi: true,
    }
  ],
},

In version "eslint": "^7.21.0"

answered Mar 02 '21 at 12:04

Mo.

26,306
36
159
225

Could you please add more info on why it becomes possible? – Pavlo Zhukov Nov 16 '21 at 08:43
...and why it is necessary (= why eslint fixer from @typescript-eslint package won't suffice) – user776686 Jan 09 '22 at 22:57

score 5 · Answer 4 · answered Apr 15 '20 at 14:09

5

For jsx strings, if you would like to set this rule for all files, create the rule in the eslint config file.

  rules: {
    'jsx-quotes': [2, 'prefer-single'],
  }

Or 'prefer-double' for double quotes.

answered Apr 15 '20 at 14:09

Allan Mwesigwa

1,210
14
13

score 4 · Answer 5 · answered Aug 27 '21 at 16:12

If you also want to allow double quotes if they would avoid escaping a single quote inside the string, and allow template literals (the reasonable defaults, imo) try the following:

{
  "env": {
    "node": 1
  },
  "rules": {
    "quotes": [2, "single", { "avoidEscape": true, "allowTemplateLiterals": true }]
  }
}

How to tell eslint that you prefer single quotes around your strings

5 Answers5

Linked