Allow the ability to ignore text or mustache interpolations, vue/multiline-html-element-content-newline.

[redelman431]

---

name: Allow Ignore text or mustache interpolation in vue/multiline-html-element-content-newline.

about: Right now I am working with NativeScript Vue and NativeScript Vue has this habit of interpreting inner element line breaks for text or moustaches as actual line breaks in the output. This causes lint fix to break the layout in some of the components. This problem does not happen when there are line breaks between other elements. So I propose there should be a way to tell that rule to ignore either text, a moustache, or both for situations like NativeScript Vue without needing to disable this entire rule. That way I can still lint inner elements.

---

Please describe what the rule should do:

Allow vue/multiline-html-element-content-newline to ignore either inner text, moustaches, or bothn while still checking for linebreaks between other inner elements.
What category should the rule belong to?

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

Provide 2-3 code examples that this rule should warn about:

<!--These are NativeScript elements-->


<!--IgnoreInnerText Option-->

"vue/multiline-html-element-content-newline": ["error", {
        ignoreInnerText:true
    }]

<!--Good-->
<GridLayout>
    <Label>Some Text</Label>
</GridLayout>

<!--Bad-->
<GridLayout><Label>Some Text</Label></GridLayout>

<!--Bad-->
<GridLayout>



    <Label>Some Text</Label>


</GridLayout>

<!--IgnoreMoustache Option-->

"vue/multiline-html-element-content-newline": ["error", {
       ignoreMoustache:true
    }]

<!--Good-->

<GridLayout>
    <Label>{{ foo.baz }}</Label>
</GridLayout>

<!--Bad-->

<GridLayout><Label>{{ foo.baz }}</Label></GridLayout>

<!--Bad-->

<GridLayout>



    <Label>{{ foo.baz }}</Label>


</GridLayout>

<!--Bad-->
<GridLayout>
    <Label>{{foo.baz}}</Label>
</GridLayout>

Additional context

N/A