JavaScriptコーディングに推奨されるVimプラグイン?[閉まっている]


125

JS&Vimは初めてです。JavaScriptコードを作成するのに役立つプラグインはどれですか?


6
質問をより明確にするため、および今後の投稿のためにOPを英語で支援するために...「こんにちは、JS&Vimは初めてです。Javascriptコードを書くのに役立つプラグインはどれですか?」あなたは、「私は新しい午前と言うことができます Javascriptとvimの」。単数形の場合は「what is」を使用できます。たとえば、「a_pluginは何に役立ちますか...」や、「which」は複数形の場合は「Which_pluginsが役立ちます...」のように使用できます。また、その代わりの通知「プラグインがありますが、」プラグインを使用する必要がある「だろう、それは架空のだから」。それがお役に立て
ば幸いです

3
@hendrixski-投票を再開します。
ocodo 2013年

8
これまでで最も建設的な非建設的な質問。
Vladislav Zorov、2014年

8
この「建設的でない」質問が私のワークフローを大幅に改善するのにどのように役立ちましたか、私は非常に楽しんでいます。
MaiaVictor 2014年

質問は(不当にIMOで)クローズされているので、ここにコメントを追加します。NeoVimの電子ベースのフロントエンドで、typescript言語サーバーのオートコンプリートがそのまま使用できます(バニラJSでも動作します!):onivim.io。それはまだ少し荒れていますが、私はこれを数週間にわたって毎日のドライバーとして使用しており、問題はあまりありませんでした。周りには本当に良いコミュニティがあり、非常に開発が進んでいるので、将来的には良いことを期待しています!完全な開示:私はプロジェクトに毎月寄付し、将来は貢献する予定です。
Parker Ault

回答:


116

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

Syntastic Vimプラグインを使用して、JSLint またはコミュニティ主導のjshint.com(IMOの方が優れています)をVim に統合する非常に簡単な方法があります。詳細については、他の投稿を参照しください。

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

Cloud9 IDEAceオンラインエディターでも使用されているMozillaのDoctorJS(以前のjsctags)を使用してタグリストを追加する非常に優れた方法もあります

  1. お気に入りのパッケージマネージャー(Ubuntuのapt-get、Macのホームbrewなど)を使用して、次のパッケージをインストールします。
    1. exuberant-ctags
      • 注:インストール後、OSがプリインストールされているのではなく、ctags実際に実行されていることを確認してください。を実行すると確認できます。exuberant-ctagsctagsctags --version
    2. node (Node.js)
  2. DoctorJSgithubからのクローン:git clone https://github.com/mozilla/doctorjs.git
  3. DoctorJSdir 内に移動しmake installます(makeアプリもインストールする必要がありますが、これは非常に基本的です)。
    • プラグインのインストールにはいくつかのバグがありますmake installが、現時点ではうまくいきません。今のところは、bin/代わりにリポジトリのディレクトリを$ PATHに追加するだけです。詳しくは、DoctorJSのGitHubと問題のページをご覧ください。
  4. TagBar Vimプラグインをインストールします注:これはTagBarであり、古い悪名高いTagListではありません!)。
  5. 利益。:)

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

DoctorJSは現在死んでいます。tern.jsという新しい有望なプロジェクトがあります。現在は初期ベータ版であり、最終的には置き換えられる予定です。

エンジンとしてternを使用するプロジェクトramitos / jsctagsがあります。npm install -gそれだけで、タグバーは自動的にそれをJavaScriptファイルに使用します。


5
TagBarの+1(TagListのみを認識していた!)
RobM、2011年

9
現在、doctorjsは、このバグで指定されているように再帰的なクローンを作成する必要がgit clone --recursive https://github.com/mozilla/doctorjs.gitあり、その後、インストールが機能するはずです
Andy Ray

1
Windows上doctorjs:baumichel.blogspot.ca/2011/11/...は TagBarに追加のファイルタイプを追加:github.com/majutsushi/tagbar/wiki
アンドリュー

6
ステップ3を実行する前に、cdtorjsにcdして、これを実行しますgit submodule init && git submodule update。そして、ステップ3.行う
glortho

2
brewコマンドは実際にはbrew install ctags-exuberant
sym3tri

17

snipMateは、TextMateの挿入システムをエミュレートし、デフォルトで(特に)便利なJSスニペットの束が付属しています。独自のものを追加するのは非常に簡単です。

javaScriptLintを使用すると、jslに対してコードを検証できます

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

ネイティブのオムニコンプリート(ctrlx- ctrlo)は私にとって非常にうまく機能します。autoComplPopでより動的にすることができますが、時々煩わしい場合があります。

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

acpはデフォルトではJavaScriptでは機能しません。少し微調整する必要があります。ここに私がそれをした方法があります(汚いハック、私はまだVim noobです):

vim-autocomplpop / plugin / acp.vimに追加しphpjavascript(および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についても同じことを行いました。

作るためにVimのコマンドラインでのセットフィート= html.css.javascript:あなたが行うことができ、HTML文書内の編集JS / CSSにしたい場合ctrlx- ctrloJSブロックとCSSブロック内のプロパティ/値のメソッド/プロパティ名で期待どおりに動作します。ただし、このアプローチには欠点もあります(奇妙なインデント…)。


クールなキーストロークをどのように行いましたか?
Maxim Sloyko、2011年

1
はは、<kbd> </ kbd>です。通常、ブラウザにはこのタグのデフォルトのスタイルがありません。追加の作業を行うためにSOチームに敬意を表します。
romainl 2011年

romainlに感謝しますが、autoComplPopに問題があります。これは、htmlファイル、js、css、phpでのみ機能します
Tarek Said

多くのVimプラグインと同様に、acpはファイルタイプに非常に敏感です。バッファのファイルタイプが「html」の場合、埋め込みJS / CSS / PHPではacpもomni completeも機能しません。そして、私は私の答えを編集しますが、ここでは編集オプション/部屋が十分ではありません。
romainl 2011年

Rok Garbas&co。のsnipMateの現在のメンテナンスブランチを使用することをお勧めします。まとめる。
thisgeek

8

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


3
私は、js-beautifierなどを統合するvim用の一般的なオートフォーマットプラグインを作成しました。こちらを確認してください:github.com/Chiel92/vim-autoformat
Chiel ten Brinke

美しい-最高
Alex Shwarc 2017年

6

私は1つのjs固有のvimプラグイン-jslint.vim- https: //github.com/hallettj/jslint.vimのみを使用します。これは、jslintsルールでコードを検証し、構文エラーも提供します。



うーん、Windowsには従う必要がある特定の指示があります。JavaScriptインタープリターが必要です。Windowsにインストールしたことはありませんが、インストール手順はREADMEのページの少し下にあります。
スコット

3

インデントとオートフォーマットを修正するには(Ctrl =):JavaScriptインデント

インデント幅を設定するには、javascript.vimファイルを〜/ .vim / ftplugin dirに次の内容で追加します(2つのスペースインデント用):

 setl sw=2 sts=2 et

in ~/.vimrcautocmd FileType javascript setlocal sw=2 ts=2 sts=2
JuanPablo 2014年
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.