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'
}
]
Please sign in to leave a comment.
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
@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!
>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
This is what I want:


And this is what I get :)
So there is no way to reformat a jsx file to put every Component in a new line?
Exactly, see https://intellij-support.jetbrains.com/hc/en-us/community/posts/360003512420/comments/360000473979 above