Enforce the use of curly quotes and apostrophes.
✨ Simple and customizable 🔧 Compatible with JavaScript, TypeScript, JSX and Vue!
Fixable: This rule is automatically fixable using the --fix
flag on the command line.
CAUTION
The plugin replaces quotes used in query selector or stringified JSON strings when using the
--fix
flag on the command line. To ignore a specific string:Use tagged template literals:
String.raw`{"foo": "bar"}`Or disable the rule for the line:
const data = '{"foo": "bar"}' // eslint-disable-line curly-quotes/no-straight-quotes
Install ESLint:
npm i --save-dev eslint
Install eslint-plugin-curly-quotes
:
npm i --save-dev eslint-plugin-curly-quotes
Add eslint-plugin-curly-quotes
to the plugins
section of your eslint.config.mjs
configuration file:
import curlyQuotes from "eslint-plugin-curly-quotes"
export default [
{
plugins: {
"curly-quotes": curlyQuotes,
},
},
]
Then add the no-straight-quotes
rule to the rules
section:
import curlyQuotes from "eslint-plugin-curly-quotes"
export default [
{
plugins: {
"curly-quotes": curlyQuotes,
},
rules: {
"curly-quotes/no-straight-quotes": "warn",
},
},
]
You may customize the characters used to replace straight quotes:
import curlyQuotes from "eslint-plugin-curly-quotes"
export default [
{
plugins: {
"curly-quotes": curlyQuotes,
},
rules: {
"curly-quotes/no-straight-quotes": [
"warn",
{
"single-opening": "‘",
"single-closing": "’", // This character is also used to replace apostrophes.
"double-opening": "“",
"double-closing": "”",
"ignored-jsx-elements": ["script", "style"], // Straight quotes in these JSX elements are ignored.
"ignored-jsx-attributes": ["className"], // Straight quotes in these JSX attributes are ignored.
"ignored-function-calls": ["Error"], // Straight quotes passed as parameters to these functions are ignored.
},
],
},
},
]
- Plugin inspired by
eslint-plugin-prefer-smart-quotes
- Algorithm adapted from “Ideas for converting straight quotes to curly quotes” by ShreevatsaR on Stack Overflow