How do I fix incorrect inline Javascript indentation in Vim? - Stack Overflow

admin管理员组

文章数量:1134247

I can't seem to get inline Javascript indenting properly in Vim. Consider the following:

  $(document).ready(function() {

  // Closing brace correctly indented
    $("input").focus(function() {
      $(this).closest("li").addClass("cur-focus");
    }); // <-- I had to manually unindent this

  // Closing brace incorrectly indented
    $("input").blur(function() {
      $(this).closest("li").removeClass("cur-focus");
      }); // <-- This is what it does by default. Argh!

  });

Vim seems to insist on automatically indenting the closing brace shown in the second case there. It does the same if I re-indent the whole file. How do I get it to automatically indent using the more standard JS indenting style seen in the first case?

I can't seem to get inline Javascript indenting properly in Vim. Consider the following:

  $(document).ready(function() {

  // Closing brace correctly indented
    $("input").focus(function() {
      $(this).closest("li").addClass("cur-focus");
    }); // <-- I had to manually unindent this

  // Closing brace incorrectly indented
    $("input").blur(function() {
      $(this).closest("li").removeClass("cur-focus");
      }); // <-- This is what it does by default. Argh!

  });

Vim seems to insist on automatically indenting the closing brace shown in the second case there. It does the same if I re-indent the whole file. How do I get it to automatically indent using the more standard JS indenting style seen in the first case?

• javascript
• vim

Share Improve this question Follow edited Mar 6, 2009 at 20:19 Charles Roper asked Mar 6, 2009 at 20:13 Charles RoperCharles Roper 20.6k2020 gold badges7575 silver badges105105 bronze badges

Add a comment  | 

9 Answers 9

Sorted by: Reset to default 88

The most comprehensive and bug-free Javascript indentation script is the one by Preston Koprivica. The so called OOP script that is in the proposed answer has severe bugs, and does not indent code properly that has square brackets.

Use JavaScript Indent: Javascript indenter (HTML indent is included) by Preston Koprivica. Thanks for the heads-up from oligofren - give him an up-vote.

The scripts mentioned above do not format the closure-syntax often used in jQuery correctly:

$(function() {
  // only one level of indentation, not two
});

This script works better for me: http://www.vim.org/scripts/script.php?script_id=2765

Most of these answers are from 2009 and, frankly, are out of date.

vim-javascript is much more recent and up-to-date than Preston's script.

Installation is a bit more complicated if you haven't started using Vundle yet, but it doesn't seem to suffer from the issues of the alternatives.

maybe some combination of these settings should be in your VIMRC file.

syntax on 
set syn=auto 
set showmatch 
filetype on 
filetype plugin on 
filetype indent on 
set tabstop=4 
set softtabstop=4 
set shiftwidth=4 
set expandtab

I had this same issue. This is the best of all Javascript indentation scripts:

http://www.vim.org/scripts/script.php?script_id=1840

It requires the IndentAnything plugin

http://www.vim.org/scripts/script.php?script_id=1839

As an added bonus, I wrote this indent script that will make Javascript blocks quite pretty. It uses the default html indenter by default (and the IndentAnything one when within a Javascript block)

http://gist.github.com/371902

In case someone comes here please note the vim-javascript by pangloss at https://github.com/pangloss/vim-javascript helped me so far, i.e. Vim 7.4. And the above solutions from oligofren and Charles Roper didn't.

You don't have to install plugins specialised for Javascript, you can learn the built-in Vim options for indentation. Vim has quite a few options, and some of the indenting styles like cindent, smartindent and indentexpr have options of their own.

To check whether you are using cindent or smartindent or indentexpr, run:

:set cindent?
:set smartindent?
:set indentexpr?

Despite the name, cindent doesn't just apply to C programs, it can apply to a bunch of programming languages that share roughly the same syntax, including Javascript. Have a look at :help C-indenting for documentation about this. You can adjust the settings particularly with a line like this one, see :help 'cinoptions' and :help cinoptions-values. Here's an example configuration:

:au FileType js,javascript setlocal shiftwidth=2 softtabstop=2 cinoptions=j1,J1,(1s " see help cino-j cino-J cino-(

Assuming the syntax file has good indenting for java script, visually highlight the block and press =. This works for java so I would expect it to do something half decent for java script. The results probably also depend on the settings of tabstop, expandtab and maybe shiftwidth.

gq is useful too, it formats lines rather than indents them.

本文标签： How do I fix incorrect inline Javascript indentation in VimStack Overflow