13

Is there a way to configure ESLint w/ Prettier to enforce the max-len / printWidth rule but not require it? That is to say, allow you to add line breaks as you see fit?

// eslintrc.js

"max-len": [0, 160, 2, { ignoreUrls: true }],

// prettier.config.js

module.exports = {
  trailingComma: "all",
  tabWidth: 2,
  semi: true,
  singleQuote: false,
  printWidth: 160,
};
David Bradshaw
  • 11,859
  • 3
  • 41
  • 70
Kirk Ross
  • 6,413
  • 13
  • 61
  • 104
  • What do you mean *"not require"*? It's not like it makes you write all lines to exactly 160 characters. – jonrsharpe Aug 14 '20 at 20:56
  • @jonrsharpe - I have my IDE set to autofix on save and if an elements with five or six attributes CAN fit within my max len, it auto corrects it and "forces" it. I don't want to turn off autofix-on-save, and even if I do, I get little underlines wherever there's an "unnecessary" line break (which I in fact want). – Kirk Ross Aug 14 '20 at 21:16
  • 1
    Then you likely don't want prettier's printWidth: https://prettier.io/docs/en/options.html#print-width. Or maybe prettier, if you have a layout you "want". – jonrsharpe Aug 14 '20 at 21:18
  • Prettier kind of sucks in this way. It does indeed "make you write lines to [not exactly but near] 160 characters". Ideally, it would apply printWidth to only lines that were too long, but not make lines longer that are too short. – Matthew Dean May 25 '22 at 16:23

1 Answers1

12

Set print-width to 999 in prettier to turn it off, then set the eslint max-len rule to be a warning at what ever your preferred value is.

David Bradshaw
  • 11,859
  • 3
  • 41
  • 70
  • 2
    Your `max-len` rule should be formatted like this `'max-len': [1, { code: 100 }],` for instance to set the line width of `code`, where 1 tells eslint to warn when longer than 100 – JohnDoe Feb 01 '21 at 10:05
  • Setting print-width to 999 does not turn it off, it tells Prettier that each line should aim at being 999 characters long. If you've got a max-len rule with ESLint there is going to be a conflict between these two rules. – papillon Mar 03 '23 at 16:19
  • With ESLint the last plugin wins. You should always include prettier last as it conflicts with half the eslint standard rule set. – David Bradshaw Mar 03 '23 at 18:26
  • I set `"printWidth": 999,` in my `.prettierrc` and I set `'max-len': 'off',` in `.eslintrc.cjs` and it now formats long lines in one line BUT it 1) still yells at me saying to replace the spaces with newlines `eslint(prettier/prettier)` AND 2) if I want to make a new line it FORCES me to put it back to one when I format... How can I tell eslint and prettier to just leave me alone in terms of line length? – Justin Jul 22 '23 at 18:46