Empfohlene Vim-Plugins für die JavaScript-Codierung? [geschlossen]

125

Ich bin neu bei JS & Vim. Welche Plugins würden mir helfen, Javascript-Code zu schreiben?

Tarek Saied
quelle
6
Um der Frage mehr Klarheit zu geben und dem OP in Englisch für zukünftige Beiträge zu helfen ... Es sollte lauten: "Hallo, ich bin neu bei JS & Vim. Welche Plugins würden mir helfen, Javascript-Code zu schreiben?" Sie können sagen "Ich bin neu in Javascript und vim". Sie können "Was ist" für Singular verwenden, also zum Beispiel "Was ist ein_Plugin , das mir helfen würde ..." oder Sie können "Was " für einen Plural wie diesen verwenden: " Welche_Plugins würden mir helfen ...". Beachten Sie auch, dass Sie anstelle von "Plugins ist " "Plugins würden " verwenden sollten, da dies hypothetisch ist. Hoffe das hilft :-)
Hendrixski
3
@hendrixski - stimme ab, um dies wieder zu öffnen.
ocodo
8
Die konstruktivste nicht-konstruktive Frage aller Zeiten.
Vladislav Zorov
8
Ich genieße es sehr, wie diese "nicht konstruktive" Frage mir geholfen hat, meinen Workflow stark zu verbessern.
MaiaVictor
Da die Frage (zu Unrecht IMO) geschlossen ist, füge ich hier nur einen Kommentar hinzu: Es gibt ein elektronenbasiertes Front-End für NeoVim mit sofort einsatzbereiter automatischer Vervollständigung des Typoskriptservers (funktioniert auch mit Vanilla JS!): Onivim.io . Es ist immer noch etwas rau an den Rändern, aber ich benutze es seit ein paar Wochen als meinen täglichen Fahrer und hatte nicht allzu viele Probleme. Es hat eine wirklich gute Community und es befindet sich in einer sehr starken Entwicklung, daher erwarte ich in Zukunft gute Dinge davon! Vollständige Offenlegung: Ich spende monatlich für das Projekt und plane, in Zukunft einen Beitrag zu leisten.
Parker Ault

Antworten:

116

Syntaxprüfung / Flusen

Es gibt eine sehr einfache Möglichkeit, JSLint oder das Community-gesteuerte jshint.com (was IMO viel besser ist) mithilfe des Syntastic Vim-Plugins in Vim zu integrieren. Siehe meinen anderen Beitrag für weitere Informationen.

Quellcode-Browsing / Tag-Liste

Es gibt auch eine sehr nette Art und Weise Tag-Liste hinzufügen mit Mozillas DoctorJS (früher jsctags ), die auch in verwendet wird Cloud9 IDE ‚s Ace Online - Editor .

  1. Installieren Sie die folgenden Pakete mit Ihrem bevorzugten Paketmanager (Ubuntus apt-get, Macs Homebrew usw.):
    1. exuberant-ctags
      • HINWEIS: Stellen Sie nach der Installation sicher, dass die Ausführung ctagstatsächlich ausgeführt wird exuberant-ctagsund nicht das Betriebssystem vorinstalliert ist ctags. Sie können dies durch Ausführen herausfinden ctags --version.
    2. node (Node.js)
  2. Klon DoctorJSvon Github:git clone https://github.com/mozilla/doctorjs.git
  3. Gehen Sie in DoctorJSdir und make install(Sie müssen auch die makeApp installiert haben, aber das ist sehr einfach).
  4. Installieren Sie das TagBar Vim-Plugin ( HINWEIS: Es ist TagBar, nicht die alte berüchtigte TagList!).
  5. PROFITIEREN. :) :)

Neues Projekt - Tern.js

DoctorJS ist derzeit tot . Es gibt ein neues vielversprechendes Projekt namens tern.js . Es befindet sich derzeit in der frühen Beta und sollte es eventuell ersetzen.

Es gibt ein Projekt ramitos / jsctags , das Seeschwalbe als Engine verwendet. Nur npm install -ges, und Tagbar wird es automatisch für Javascript-Dateien verwenden.

Ory Band
quelle
5
+1 für TagBar (war nur TagList bekannt!)
RobM
9
Derzeit erfordert doctorjs, dass Sie rekursiv klonen, wie in diesem Fehler angegeben , git clone --recursive https://github.com/mozilla/doctorjs.gitund dann die Installation
Andy Ray
1
doctorjs unter Windows: baumichel.blogspot.ca/2011/11/… Hinzufügen zusätzlicher Dateitypen zu TagBar: github.com/majutsushi/tagbar/wiki
Andrew
6
Bevor Sie Schritt 3 ausführen, legen Sie eine CD in doctorjs ein und führen Sie folgende Schritte aus : git submodule init && git submodule update. Dann machen Sie Schritt 3.
Glortho
2
Der brew install ctags-exuberant
Braubefehl
17

snipMate emuliert das Einfügesystem von TextMate und enthält standardmäßig eine Reihe nützlicher JS-Snippets (unter anderem). Es ist extrem einfach, eigene hinzuzufügen.

Mit javaScriptLint können Sie Ihren Code gegen jsl validieren .

Auf vim.org finden Sie auch eine Vielzahl von JavaScript- Syntaxdateien. Probieren Sie sie aus und finden Sie heraus, welches für Sie und Ihren Codierungsstil am besten geeignet ist.

Das native omnicomplete ( ctrlx- ctrlo) funktioniert bei mir sehr gut. Sie können es mit autoComplPop dynamischer gestalten , aber es kann manchmal ärgerlich sein.

bearbeiten, als Antwort auf den Kommentar von tarek11011:

acp funktioniert standardmäßig nicht für JavaScript, Sie müssen es ein wenig optimieren. Hier ist, wie ich es gemacht habe (Dirty Hack, ich bin immer noch ein Vim Noob):

In vim-autocomplpop / plugin / acp.vim habe ich phpund javascript(und actionscript) hinzugefügt , behavsdamit es so aussieht:

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

Ein wenig weiter unten gibt es eine Reihe von Codeblöcken, die so aussehen:

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

Ich habe dieses dupliziert und ein wenig bearbeitet, um so auszusehen:

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

und tat das gleiche für Actionscript und PHP.

Wenn Sie JS / CSS in einem HTML-Dokument bearbeiten möchten, gehen Sie wie folgt vor: Setzen Sie ft = html.css.javascript in der Befehlszeile von Vim, damit ctrlx- ctrlowie erwartet mit Methoden- / Eigenschaftsnamen in JS-Blöcken und Eigenschaften / Werten in CSS-Blöcken gearbeitet wird. Dieser Ansatz hat jedoch auch seine Nachteile (seltsame Einrückung…).

romainl
quelle
Wie hast du diese cool aussehenden Tastenanschläge gemacht?
Maxim Sloyko
1
Haha, es ist <kbd> </ kbd>. Browser haben normalerweise kein Standard-Styling für dieses Tag. Ein großes Lob an das SO-Team für die zusätzliche Arbeit.
Romainl
danke romainl, aber ein problem mit autoComplPop hat es funktioniert nur mit html datei no js und css und php
Tarek Saied
Wie viele Vim-Plugins reagiert acp sehr empfindlich auf Dateitypen. Wenn der Dateityp des Puffers "html" ist, funktionieren weder acp noch omni complete für eingebettetes JS / CSS / PHP. Und ich werde meine Antwort bearbeiten, nicht genug Bearbeitungsoptionen / Raum hier.
Romainl
Möglicherweise bevorzugen Sie die Verwendung des aktuellen Wartungszweigs von snipMate , den Rok Garbas & Co. zusammensetzen.
Thisgeek
8

Dieses Plugin ist auch nützlich: https://github.com/maksimr/vim-jsbeautify . Es bietet eine vollständige automatische Formatierung für Javascript. Ein Tastendruck, und Ihr Code sieht wunderschön aus. Dies kann auch beim Einfügen von Codefragmenten nützlich sein. Es nutzt den beliebten js-Verschönerer, der auch als Online-Bewerbung zu finden ist. Letzteres finden Sie hier: http://jsbeautifier.org/ .

Chiel ten Brinke
quelle
3
Ich habe ein allgemeines Autoformating-Plugin für vim geschrieben, das den js-Verschönerer und mehr integriert. Überprüfen Sie hier: github.com/Chiel92/vim-autoformat
Chiel ten Brinke
hübscher - der beste
Alex Shwarc
6

Ich verwende nur ein js-spezifisches vim-Plugin - jslint.vim - https://github.com/hallettj/jslint.vim, das Ihren Code mit jslints-Regeln validiert und Ihnen auch Syntaxfehler gibt.

Scott
quelle
Danke, aber ich glaube, ich habe ein Problem. Schauen Sie sich img69.imageshack.us/img69/7629/11142565.png an
Tarek Saied
Hm, unter Windows gibt es spezielle Anweisungen, die Sie befolgen müssen. Es ist ein Javascript-Interpreter erforderlich. Ich habe nicht versucht, es unter Windows zu installieren, aber die Installationsanweisungen finden Sie etwas weiter unten in der README-Datei. Es tut mir leid, dass ich dort nicht mehr helfen kann.
Scott
3

So korrigieren Sie den Einzug und die automatische Formatierung (Strg =): JavaScript-Einzug

javascript.vimFügen Sie zum Festlegen der Einrückungsbreite eine Datei mit dem folgenden Inhalt in das Verzeichnis ~ / .vim / ftplugin ein (für Einrückungen mit zwei Leerzeichen):

 setl sw=2 sts=2 et
Evgenii
quelle
in ~/.vimrc:autocmd FileType javascript setlocal sw=2 ts=2 sts=2
JuanPablo