web-dev-qa-db-ja.com

JavaScriptコーディングに推奨されるVimプラグインは？

私はJS＆Vimが初めてです。 Javascriptコードの記述に役立つプラグインはどれですか？

javascriptvim
125
Tarek Saied

構文チェック/リンティング

Syntastic Vimプラグインを使用して、JSLintまたはコミュニティ主導の jshint.com （これははるかに優れたIMO）をVimと統合する非常に簡単な方法があります。詳しくは my other post をご覧ください。

ソースコードの閲覧/タグリスト

また、MozillaのDoctorJS（以前jsctags）を使用してタグリストを追加する非常に適切な方法もあります。 Cloud9 IDE 's Ace online editor 。

  1. お気に入りのパッケージマネージャー（Ubuntuのapt-get、Macの home brew など）を使用して以下のパッケージをインストールします。
    1. exuberant-ctags
      • 注：インストール後、OSにプリインストールされているctagsではなく、ctagsが実際にexuberant-ctagsを実行していることを確認してください。 ctags --versionを実行すると確認できます。
    2. node（Node.js）
  2. GithubからDoctorJSを複製：git clone https://github.com/mozilla/doctorjs.git
  3. DoctorJS dirとmake installの中に移動します（makeアプリもインストールする必要がありますが、これは非常に基本的なものです）。
    • プラグインのインストールにはいくつかのバグがあります。make installは今のところトリックを行いません。とりあえず、代わりにリポジトリのbin/ dirを$ PATHに追加します。詳細については、 DoctorJSのGitHubおよび発行ページ を参照してください。
  4. TagBar Vimプラグイン （注：古い悪名高いTagListではなくTagBarです！）.
  5. 利益。 :)

新しいプロジェクト-Tern.js

DoctorJSは現在停止しています 。 tern.js という新しい有望なプロジェクトがあります。現在、初期のベータ版であり、最終的にそれを置き換える必要があります。

プロジェクトがあります ramitos/jsctags ternをエンジンとして使用します。ちょうどnpm install -g itで、タグバーはjavascriptファイルに自動的に使用します。

115
Ory Band

snipMate TextMateのエミュレート ⇥ 挿入システムであり、デフォルトで（特に）有用なJSスニペットの束が付属しています。独自に追加するのは非常に簡単です。

javaScriptLint では、コードを jsl。 に対して検証できます。

また、vim.orgでさまざまな JavaScript構文ファイル を見つけることができます。それらを試して、どれがあなたとあなたのコーディングスタイルに最適かを見てください。

ネイティブのオムニコンプリート（ctrlx-ctrlo）私にとって非常にうまく機能します。 autoComplPop でより動的にすることができますが、時々迷惑になることがあります。

tarek11011のコメントに応じて編集：

acpはデフォルトではJavaScriptに対して機能しません。少し調整する必要があります。ここに私がそれをした方法があります（汚いハック、私はまだVim初心者です）：

Vim-autocomplpop/plugin/acp.vimで、phpとjavascript（およびactionscript）をbehavsに追加したので、次のようになります。

let behavs = {
    \   '*'            : [],
    \   'Ruby'         : [],
    \   'python'       : [],
    \   'Perl'         : [],
    \   'xml'          : [],
    \   'html'         : [],
    \   'xhtml'        : [],
    \   'css'          : [],
    \   'javascript'   : [],
    \   'actionscript' : [],
    \   'php'          : [],
    \ }

その少し下に、次のような一連のコードブロックがあります。

"---------------------------------------------------------------------------
call add(behavs.Ruby, {
    \   'command' : "\<C-x>\<C-o>",
    \   'meets'   : 'acp#meetsForRubyOmni',
    \   'repeat'  : 0,
    \ })

これを複製し、少し編集して次のようにしました。

"---------------------------------------------------------------------------
call add(behavs.javascript, {
    \   'command' : "\<C-x>\<C-o>",
    \   'meets'   : 'acp#meetsForRubyOmni',
    \   'repeat'  : 0,
    \ })

actionscriptとphpについても同じことをしました。

HTMLドキュメント内でJS/CSSを編集する場合は、Vimのコマンドラインで：set ft = html.css.javascriptを実行して、 ctrlx-ctrlo JSブロックのメソッド/プロパティ名とCSSブロックのプロパティ/値で期待どおりに動作します。ただし、このアプローチにも欠点があります（奇妙なインデント…）。

17
romainl

このプラグインも便利です： https://github.com/maksimr/vim-jsbeautify 。 javascriptの完全な自動フォーマットを提供します。 1回のキーストロークで、コードが美しく見えます。コードスニペットを貼り付けるときにも役立ちます。人気のあるjs-beautifierを使用します。これは、オンラインアプリケーションとしても見つけることができます。後者は http://jsbeautifier.org/ にあります。

8
Chiel ten Brinke

Jslint.vim- https://github.com/hallettj/jslint.vim というjs固有のvimプラグインを1つだけ使用します。これにより、jslintsルールでコードが検証され、構文エラーも発生します。

6
Scott

インデントと自動フォーマットを修正するには（Ctrl =）： JavaScript Indent

インデント幅を設定するには、次の内容でjavascript.vimファイルを〜/ .vim/ftplugin dirに追加します（2スペースのインデントの場合）：

 setl sw=2 sts=2 et
3
Evgenii