CODEWITHSUNDEEP
javascripthtmlvim
Kaign
Kaign

Reputation: 353

vim indent html code inside javascript file

here is an example of code inside of my .js file after gg=G command:

class ChannelSection extends React.Component{
    render(){
        return(
            <div>
            <ChannelList channels={channels} />
            <ChannelForm />
            </div>
        )   
    }   
}

As you can see html tags have the same indent. I wish it would be like in html files - nested blocks indented further. Some plugin that can help?

Again, I need to indent ONLY HTML tags in .js file, not in .html file.

Upvotes: 2

Views: 1507

Answers (2)

joeljpa
joeljpa

Reputation: 539

Without plugins and just as a temporary quick solution, I found the command :set filetype=html (alias as :set ft:html) to be quite effective. This worked very well for me due to my work on HTML being minimal but persistent.

Indent the whole file via gg=G or selected section using just =.

Done. Now revert to the previous filetype (in your case, js) doing the reverse :set ft=javascript and continue as you were.

If you didn't know your default filetype use :set filetype? before doing this.

Upvotes: 0

Yous
Yous

Reputation: 728

You may use mxw/vim-jsx. This plugin requires pangloss/vim-javascript, so you should install both of them.

This is a minimal .vimrc I used with vim-plug:

set nocompatible
filetype off

call plug#begin()
Plug 'pangloss/vim-javascript'
Plug 'mxw/vim-jsx'
call plug#end()

let g:jsx_ext_required = 0

Note that I set g:jsx_ext_required to 0 because you want to edit JSX tags in .js files.

Upvotes: 3

Related Questions