如何在Vim中格式化JS代码？

Question

我有一点JavaScript..。

 15   $('.ajax_edit_address').each(function() {
 16     $(this).ajaxForm({
 17       target: $(this).parents('table.address').find('tr.address_header').children(':first'),
 18       success: function(response) {
 19         $('input, select, textarea', '.ajax_edit_address').removeClass('updating');
 20       }
 21     });
 22   });

这是我喜欢的格式。但是假设我刚输入完一些东西，我想把它整理一下。所以我在上面运行了Vim代码格式化程序...

=7j

结果就是...

 15   $('.ajax_edit_address').each(function() {
 16       $(this).ajaxForm({
 17 target: $(this).parents('table.address').find('tr.address_header').children(':first'),
 18 success: function(response) {
 19 $('input, select, textarea', '.ajax_edit_address').removeClass('updating');
 20 }     
 21 }); 
 22       });

Vim似乎在使用函数作为方法参数时遇到了问题。

这是我认为是我的.vimrc的相关部分...

:set cindent shiftwidth=2

" indent depends on filetype
:filetype indent on

:filetype plugin on

是否还需要安装或配置其他内容来格式化JS代码？

Answer 1

最大的问题似乎是cindent无法识别这种类型的语法：

test({
  var b = 2;
});

它会把它变成这样：

test({
    var b = 2;
    });

如果您处理了这种情况，我可以想象缩进对于jQuery语法来说不会那么糟糕。但是这需要你编写一个自定义的javascript缩进文件。此外，您还必须编辑html缩进文件，以使其不对带有javascript内容的脚本标记使用cindent。

我认为还没有人成功地为javascript创建了jquery/prototype兼容的缩进文件。现有的javascript缩进脚本都有缺陷。

Answer 2

VIM插件Jsbeautify可以正确处理jQuery。它是在线Jsbeautify的vim插件版本。

Answer 3

有一个简单得多的解决方案，不需要vim插件。

将js-beautify安装到您的系统python：

pip install jsbeautifier

然后将以下内容添加到您的.vimrc：

autocmd FileType javascript setlocal equalprg=js-beautify\ --stdin

就这样。

运行:help equalprg查看其工作原理。