1

I'm trying to figure out how to get vim to correctly indent the next line in a JSX block.

Currently when I press enter, the cursor goes slightly behind where it should be. In the example below, my cursor starts after <Switch>. Then, when I press enter, the cursor is on the next line, but 4 spaces before where it should be.

// This is in a class, in a file foo.js.
render() {
  return (
    <Fragment>
      <Switch>|start
    |got
        |want
      </Switch>
    </Fragment>
  );
}

These are the settings in my vimrc file.

" Global settings.
set autoindent
set shiftwidth=4
set smartindent
set tabstop=4
filetype plugin indent on
syntax off

" Javascript specific settings.
autocmd FileType javascript setlocal tabstop=2 softtabstop=2 shiftwidth=2 expandtab

If I'm not in a JSX block, then the indentation seems to work fine.

constructor(props) {
  super(props);|start
  |got
}

P.D. I'd like to avoid installing a plugin, if possible.

  • 1
    I'm not sure I completely follow your desired v. happening behavior, but try not enabling smartindent—it's only good for C-style (brace) languages. You don't want it on globally (and ftplugin indent on should enable it automatically when you need it). – D. Ben Knoble Oct 8 at 2:10

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.