Rule Proposal: vue/max-len

[sebiniemann]

Please describe what the rule should do:
Currently, any line within <template> is forced to respect the max-len rule, without any option to ignore text-focused nodes (i.e. text nodes and phrasing content).

This does not seems to be in line with the current ignore options for max-len, as it already allows to keep long string, URLs, template literals, RegExp literals, ... together in a single line.

What category should the rule belong to?

• Enforces code style
• Warns about a potential error
• Suggests an alternate way of doing something
• Other (please specify:)

It's a proposal to add an ignore option.

Provide 2-3 code examples that this rule should warn about:
The following examples should be fine (NO warning):

Text node within a flow content:

<template>
  <p>
    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
  </p>
</template>

Phrasing node within a flow content

<template>
  <p>
    <q>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</q>
  </p>
</template>

Additional context
This issue was already mentioned in another context (to deactivate eslint completely -- what should never be the recommended solution in my opinion) by @maxmilton (#260 (comment)):

It's particularly frustrating with the max-len eslint rule. I often have paragraphs or long elements and so I've had to disable the rule. A shame because it's useful for JS linting.

[michalsnik]

Hey @sebastianniemann Thanks for posting this issue. Implementation details of the core max-len rule result in throwing an error in the Vue template as well. We could probably introduce dedicated max-len rule, with updated logic, to allow setting different values for template and JS, as well as disabling one or another. What do you think @mysticatea? Perhaps you have other idea here? :)

[mysticatea]

It's a good idea. We can add vue/max-len rule for additional settings.

[AdsonCicilioti]

Please i need this!

[bastiW]

Good Idea! Also searched for that

[syntag]

Can't wait for this to be implemented, it's definitely a must! I have eslint-disable max-len scattered throughout many of my Vue templates, which is obviously not ideal.

[kamilic]

Any progress ?