Newline before wildcard html/jsx tag; newline before object keys

Given the following jsx:

<MyComponentA><MyComponentB>{This is my content}</ MyComponentB></ MyComponentA>
<Route exact path="/my/path"render={() => (<MyComponentA><MyComponentB>{This is my content}</ MyComponentB></ MyComponentA>)}/>

What setting will format it like this?

<MyComponentA>
<MyComponentB>
{This is my content}
</ MyComponentB>
</ MyComponentA>
<Route exact path="/my/path"render={() => (
<MyComponentA>
<MyComponentB>
{This is my content}
</ MyComponentB>
</ MyComponentA>)}
/>

I've tried adding a wildcard ('*') to the list of tags to always start a new line but that hasn't worked.

Likewise I haven't found the setting to format this:

[
{
foo: 'bar'
}, {
baz: 'biz'
}
]

To be like this:


[
{
foo: 'bar'
},
{
baz: 'biz'
}
]
1
6 comments

there is unfortunately no way to format JSX in the way you like, please follow https://youtrack.jetbrains.com/issue/WEB-37966 for updates

Same - for object; related ticket: https://youtrack.jetbrains.com/issue/WEB-7122

0

@Elena

I see from https://youtrack.jetbrains.com/issue/WEB-37966 that I can enable "Keep line breaks in text" to retain existing breaks for JSX, so that's something. Just throwing an idea out there, would a wildcard option as I described above be viable? Having no JSX-specific settings for tags seems like an oversight considering the otherwise robust React support.

For Object formatting, that ticket is 6 years old :) Any thoughts on some additional settings for Object literals?

thanks!

0

>I see from https://youtrack.jetbrains.com/issue/WEB-37966 that I can enable "Keep line breaks in text" to retain existing breaks for JSX, so that's something.

Yes, enabling Keep line breaks in text in Settings | Editor | Code Style | HTML | Other should preserve existing line breaks on reformatting

 

>Any thoughts on some additional settings for Object literals?

no, sorry:( You can add missing line breaks manually and enable Keep when reformatting/Line breaks in Settings | Editor | Code Style | JavaScript | Wrappling and Braces

0

This is what I want:

And this is what I get :)

0

So there is no way to reformat a jsx file to put every Component in a new line?

0

Please sign in to leave a comment.