vue/html-self-closing-bracket-newline

[olemarius]

Please describe what the rule should do:

I'd like to set multiline: 'always' for self-closing tags

<MyComp
    :foo="bar"
/>

And singleline: 'never'

<MyComp :foo="bar" />

And multiline: 'never' for tags with content.

<MyComp
    :foo="bar">
    Hello World
</MyComp>

What category should the rule belong to?

[x] Enforces code style (layout) [ ] Warns about a potential error (problem) [ ] Suggests an alternate way of doing something (suggestion) [ ] Other (please specify:)

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

// singleline: 'never'
<MyComp :foo="bar"
/>
// multiline: 'always'    
<MyComp 
  :foo="bar" />

Additional context

[ota-meshi]

Thank you for the rule proposal. The rule you suggested should be an option for the existing rule vue/html-closing-bracket-newline. Otherwise, the rules will conflict. https://eslint.vuejs.org/rules/html-closing-bracket-newline.html

I think it would be nice to add an option like selfClosingTag.

<!-- { "selfClosingTag": { "singleline": "never" } } -->
<!-- ✗ BAD -->
<MyComp :foo="bar"
/>
<!-- ✓ GOOD -->
<MyComp :foo="bar"/>
<!-- { "selfClosingTag": { "multiline": "always" } } -->
<!-- ✗ BAD -->
<MyComp 
  :foo="bar" />
<!-- ✓ GOOD -->
<MyComp 
  :foo="bar"
/>

[ashutosh887]

I would like to work on this @ota-meshi

[mussinbenarbia]

@ota-meshi @FloEdelmann Is it ok if I pick this up? I have a working implementation ready

[ota-meshi]

@mussinbenarbia Thank you! Welcome pull request!