Open Cooya opened 2 months ago
I'm confused - how does closing-bracket-notation not already cover this case?
With 'react/jsx-closing-bracket-location': ['error', 'tag-aligned']
in eslintrc.js, this is accepted :
const test = <div>
Hello World</div>;
This as well :
<h4><span>
</span></h4>
It could be fixed with something like 'react/jsx-closing-tag-location': ['error', 'tag-aligned']
. react/jsx-closing-tag-location without option is too harsh to be used.
I suppose we could. At this point, i tend to think the only non-harmful style is that multiline jsx is wrapped in parens, and the opening tag starts on a new line, and the closing tag is aligned with the opening tag, and the closing paren is on a line by itself - but since we support line-aligned elsewhere it’d be reasonable to support it here.
Yes, the rule react/jsx-closing-tag-location
imposes the following syntax :
const test = (
<div>
Hello World
</div>
);
but I would rather have the possibility to do it without parens :
const test = <div>
Hello World
</div>;
It is simpler and shorter.
it's more ambiguous, and not as aligned, which to me makes it much less simpler (and "shorter" isn't something that's good to optimize for).
Yet it is implemented in the very similar rule jsx-closing-bracket-location
:
// 'jsx-closing-bracket-location': [1, 'line-aligned']
var x = <Hello
firstName="John"
lastName="Smith"
/>;
var x = function() {
return <Say
firstName="John"
lastName="Smith"
>
Hello
</Say>;
};
For me, it makes sense to have the same options in jsx-closing-tag-location
.
Indeed; it was implemented there before I maintained this plugin.
To be clear, I added the "help wanted" label which means it'll be included once a PR is ready.
@Cooya @ljharb I would love to work on this
@kimtaejin3 go for it
It would be quite nice to have the option "line-aligned" in the rule react/jsx-closing-tag-location, same as in the rule https://github.com/jsx-eslint/eslint-plugin-react/blob/master/docs/rules/jsx-closing-bracket-location.md.
With this option, the following code would be accepted :
And this one would be denied :