Add space in self closing tags before in self closing tags
Solution 1
Maybe a little confusingly, the setting is under "HTML" code style and not the JS code style in IntelliJ.
Enable the setting "In empty tag" in Preferences -> Editor -> Code Style -> HTML.
When you do an explicit reformat the space will be added. To ensure that the space is added when autocompleting React components, check the same box in in the Preferences -> Editor -> Code Style -> XML -> Other tab.
Screenshot from 2016-10-12, IntelliJ IDEA 2016.2
Solution 2
The .editorconfig way.
[**]
ij_html_space_inside_empty_tag = true
Here's how you find the name of any option. The same IDEA Code Style page has a gear button with an option to export to .editorconfig:
But this exports all the options, it's a 1070 line file in my case. So you export once to cfg1, change the desired setting through UI, export again to cfg2, and then compare the two configs to find the one option that changed.
Related videos on Youtube
Poyan
Updated on June 07, 2022Comments
-
Poyan about 2 years
How do you include a space before the closing tags in self closing tags with WebStorm/IntelliJ-based products?
Default settings turns
<ReactComp />
to<ReactComp/>
, which is against one of the rules (jsx-space-before-closing) in the commonly used AirBNBs Javascript style guide. -
Gerardo Navarro Suarez over 7 yearsThank you very much for this help. It works like charme ;-D
-
Ben Cummins over 7 yearsWow, this caused countless hours of debugging, thank you!
-
Ruben over 7 yearsThis works for me when doing an explicit reformat, but not when autocompleting jsx tags. I.e. when the autocomplete box shows while typing and I press enter it still shows the jsx tag without the space before the /
-
Patrickkx over 6 years@Ruben Add the same in XML
-
xMort about 6 yearsI missed this option. I thought this checkbox belongs to the wrapping settings section. I missed the Spaces headline.
-
Viktor Sulak about 6 yearsIs there any option like this for .editorconfig so I can propagate this to team?
-
code over 2 yearsPerfect! This works for Webstorm as well.
-
Vsevolod Golovanov about 2 years@ViktorSulak, a bit late, but added the .editorconfig answer.