Kevin Powell - Community•3mo ago

Indenting not working properly for jsx in NeoVim

My NeoVim config can be found on Github. Issue: When creating new line from the end of a JSX element (eg: <div>), there is no auto indentation in the new line. Current

return (
  <div>
  |
)

return (
  <div>
  |
)

Expected

return (
  <div>
    |
)

return (
  <div>
    |
)

where | is the location is cursor right after creating new line. This only happens for JSX components and it feels like it doesn't understand JSX, hence it returns the cursor to the last JS bracket.

4 Replies

b1mind•3mo ago

https://github.com/MaxMEllon/vim-jsx-pretty

GitHub

GitHub - MaxMEllon/vim-jsx-pretty: :flashlight: [Vim script] JSX an...

:flashlight: [Vim script] JSX and TSX syntax pretty highlighting for vim. - MaxMEllon/vim-jsx-pretty

b1mind•3mo ago

I can't speak to it but yea, probably just need to add the formatting for it.

Aoi•3mo ago

This didn't work for me, but thanks a lot, because of this I found a related question on stackoverflow which had the solution.

Aoi•3mo ago

For anyone else having same issue, i just forgot to enable indenting in tree sitter (yeah I realized I am dumb) https://vi.stackexchange.com/a/39570

Vi and Vim Stack Exchange

Neovim keep html tags indented in react/jsx files

When I edit a .html file I get this when pressing enter key: <div>|</div> <div> | </div> and while I edit a react file, the behavior is not what I was expecting: <div...

Gaming

Programming

Indenting not working properly for jsx in NeoVim