如何在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

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

Answer 2

有一个更简单的解决方案,不需要vim插件.

将js-beautify安装到你的系统python:

pip install jsbeautifier

然后将其添加到.vimrc:

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

而已.

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

Answer 3

我推荐einars/jsbeautify的CLI版本,你可以在这里找到:https://github.com/einars/js-beautify.这是www.jsbeautifier.org的离线版本.

使用此插件https://github.com/Chiel92/vim-autoformat只需按一下按钮即可在当前缓冲区上运行格式化程序.

Answer 4

如果您已经安装了js-beautify（它可用于 Python:pip install jsbeautifier或 Node: npm -g install js-beautify），那么您可以直接从 vim 运行它 - 重新格式化当前文件：

:%!js-beautify

Answer 5

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

test({
  var b = 2;
});

它会把它变成这样：

test({
    var b = 2;
    });

如果你处理这种情况，我想缩进对于 jQuery 语法来说不会那么糟糕。但这需要您编写自定义 javascript 缩进文件。另外，您必须编辑 html 缩进文件，才能不将 cindent 用于具有 javascript 内容的脚本标记。

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