eslint/docs/src/rules/quotes.md

   1 ---
   2 title: quotes
   3 layout: doc
   4 rule_type: layout
   5 ---
   6
   7
   8
   9 JavaScript allows you to define strings in one of three ways: double quotes, single quotes, and backticks (as of ECMAScript 6). For example:
  10
  11 ```js
  12 /*eslint-env es6*/
  13
  14 var double = "double";
  15 var single = 'single';
  16 var backtick = `backtick`;    // ES6 only
  17 ```
  18
  19 Each of these lines creates a string and, in some cases, can be used interchangeably. The choice of how to define strings in a codebase is a stylistic one outside of template literals (which allow embedded of expressions to be interpreted).
  20
  21 Many codebases require strings to be defined in a consistent manner.
  22
  23 ## Rule Details
  24
  25 This rule enforces the consistent use of either backticks, double, or single quotes.
  26
  27 ## Options
  28
  29 This rule has two options, a string option and an object option.
  30
  31 String option:
  32
  33 * `"double"` (default) requires the use of double quotes wherever possible
  34 * `"single"` requires the use of single quotes wherever possible
  35 * `"backtick"` requires the use of backticks wherever possible
  36
  37 Object option:
  38
  39 * `"avoidEscape": true` allows strings to use single-quotes or double-quotes so long as the string contains a quote that would have to be escaped otherwise
  40 * `"allowTemplateLiterals": true` allows strings to use backticks
  41
  42 **Deprecated**: The object property `avoid-escape` is deprecated; please use the object property `avoidEscape` instead.
  43
  44 ### double
  45
  46 Examples of **incorrect** code for this rule with the default `"double"` option:
  47
  48 ::: incorrect
  49
  50 ```js
  51 /*eslint quotes: ["error", "double"]*/
  52
  53 var single = 'single';
  54 var unescaped = 'a string containing "double" quotes';
  55 var backtick = `back\ntick`; // you can use \n in single or double quoted strings
  56 ```
  57
  58 :::
  59
  60 Examples of **correct** code for this rule with the default `"double"` option:
  61
  62 ::: correct
  63
  64 ```js
  65 /*eslint quotes: ["error", "double"]*/
  66 /*eslint-env es6*/
  67
  68 var double = "double";
  69 var backtick = `back
  70 tick`;  // backticks are allowed due to newline
  71 var backtick = tag`backtick`; // backticks are allowed due to tag
  72 ```
  73
  74 :::
  75
  76 ### single
  77
  78 Examples of **incorrect** code for this rule with the `"single"` option:
  79
  80 ::: incorrect
  81
  82 ```js
  83 /*eslint quotes: ["error", "single"]*/
  84
  85 var double = "double";
  86 var unescaped = "a string containing 'single' quotes";
  87 ```
  88
  89 :::
  90
  91 Examples of **correct** code for this rule with the `"single"` option:
  92
  93 ::: correct
  94
  95 ```js
  96 /*eslint quotes: ["error", "single"]*/
  97 /*eslint-env es6*/
  98
  99 var single = 'single';
 100 var backtick = `back${x}tick`; // backticks are allowed due to substitution
 101 ```
 102
 103 :::
 104
 105 ### backticks
 106
 107 Examples of **incorrect** code for this rule with the `"backtick"` option:
 108
 109 ::: incorrect
 110
 111 ```js
 112 /*eslint quotes: ["error", "backtick"]*/
 113
 114 var single = 'single';
 115 var double = "double";
 116 var unescaped = 'a string containing `backticks`';
 117 ```
 118
 119 :::
 120
 121 Examples of **correct** code for this rule with the `"backtick"` option:
 122
 123 ::: correct
 124
 125 ```js
 126 /*eslint quotes: ["error", "backtick"]*/
 127 /*eslint-env es6*/
 128
 129 var backtick = `backtick`;
 130 ```
 131
 132 :::
 133
 134 ### avoidEscape
 135
 136 Examples of additional **correct** code for this rule with the `"double", { "avoidEscape": true }` options:
 137
 138 ::: correct
 139
 140 ```js
 141 /*eslint quotes: ["error", "double", { "avoidEscape": true }]*/
 142
 143 var single = 'a string containing "double" quotes';
 144 ```
 145
 146 :::
 147
 148 Examples of additional **correct** code for this rule with the `"single", { "avoidEscape": true }` options:
 149
 150 ::: correct
 151
 152 ```js
 153 /*eslint quotes: ["error", "single", { "avoidEscape": true }]*/
 154
 155 var double = "a string containing 'single' quotes";
 156 ```
 157
 158 :::
 159
 160 Examples of additional **correct** code for this rule with the `"backtick", { "avoidEscape": true }` options:
 161
 162 ::: correct
 163
 164 ```js
 165 /*eslint quotes: ["error", "backtick", { "avoidEscape": true }]*/
 166
 167 var double = "a string containing `backtick` quotes"
 168 ```
 169
 170 :::
 171
 172 ### allowTemplateLiterals
 173
 174 Examples of additional **correct** code for this rule with the `"double", { "allowTemplateLiterals": true }` options:
 175
 176 ::: correct
 177
 178 ```js
 179 /*eslint quotes: ["error", "double", { "allowTemplateLiterals": true }]*/
 180
 181 var double = "double";
 182 var double = `double`;
 183 ```
 184
 185 :::
 186
 187 Examples of additional **correct** code for this rule with the `"single", { "allowTemplateLiterals": true }` options:
 188
 189 ::: correct
 190
 191 ```js
 192 /*eslint quotes: ["error", "single", { "allowTemplateLiterals": true }]*/
 193
 194 var single = 'single';
 195 var single = `single`;
 196 ```
 197
 198 :::
 199
 200 `{ "allowTemplateLiterals": false }` will not disallow the usage of all template literals. If you want to forbid any instance of template literals, use [no-restricted-syntax](no-restricted-syntax) and target the `TemplateLiteral` selector.
 201
 202 ## When Not To Use It
 203
 204 If you do not need consistency in your string styles, you can safely disable this rule.