Search code examples
reactjsvimjsxspacevim

How to jsx format supported in spacevim editor?


My spacevim config file: init.toml

 [[layers]]
      name = "lang#javascript"
      auto_fix = true
      enable_flow_syntax = true


Solution

  • To get Vim to support a certain syntax, it has to be given the relevant .syntax file. This can be done manually, or by installing a plugin that loads it for you.

    I've never used SpaceVim (I used SpaceMacs once, a couple eons ago), but looking through its documentation, the [[custom_plugins]] section looks promising. I've mocked up an example to get you started:

    [[custom_plugins]]
        name = "MaxMEllon/vim-jsx-pretty"
        merged = false
    

    However, this method will only yield limited results. This will only get Vim to recognize the syntax and highlight accordingly; if you want full linting capability, it looks like this GitHub user created a script to modify the bootstrap#after section of SpaceVim to use ESLint, which supports JSX. Note that you have to have ESLint installed for that to work.

    For anything this "extreme", it looks like modifying the bootstrap.vim file is the only real way to go. In case you ever want to do further customization outside of SpaceVim defaults, I highly recommend getting Vim/neovim and installing the plugins yourself.