wesbos / eslint-config-wesbos

No-Sweat™ Eslint and Prettier Setup - with or without VS Code

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Is it possible to wrap attributes on save using this config?

d-farrell opened this issue · comments

I'm unable to wrap any JSX attributes when I save using this eslint config. Im just wondering if I have missed something

I want to be able to format my code from this:

<input type="text" placeholder="What's your name" className="classname">

Into this:

<input type="text"
       placeholder="What's your name"
       className="classname">

I have my config setup like this:

{
  "extends": [
    "wesbos"
  ],
  "rules": {
    "prettier/prettier": [
      'react/jsx-max-props-per-line': [2, { maximum: 1 }],
      'react/jsx-indent-props': [2, 2],
      'react/jsx-first-prop-new-line': [2, 'multiline'],
      "error",
      {
        "trailingComma": "es5",
        "singleQuote": true,
        "tabWidth": 2,
        "prettier.printWidth": 80,
      }
    ]
  }
}

Hey! The settings you are quoting are eslint settings, not prettier settings, so you just need to specify them like this:

{
  "extends": [
    "wesbos"
  ],
  "rules": {
      "react/jsx-max-props-per-line": [2, { "maximum": 1 }]
   }
}

no need to nest under prettier unless it's a prettier setting