Wie kann ich Vim für die Webentwicklung und -programmierung anpassen?


10

Ich habe bereits versucht, in [askubuntu.com] etwas für meine Frage zu finden, aber nichts hat meine Bedürfnisse erfüllt. Ich möchte also vim als einen sehr leistungsfähigen und nützlichen Editor für HTML, CSS, Javascript usw. erstellen, aber auch für die Programmierung. Ich versuche CSS zu lernen und wollte im Allgemeinen einen sehr schönen Editor mit vielen Plugins. Kann mir jemand Schritt für Schritt helfen, vim anzupassen und welche Funktionen ich mir in meiner Lernphase vorstellen kann? Danke

Oh, und der einzige Weg, wie vim läuft, ist vom Terminal? Danke

*** edit ---> Ich kann meine.vimrc-Datei nicht finden

mein Home-Ordner

Antworten:


11

Alle anderen haben ausgezeichnete Ratschläge, ich dachte, ich würde einige der Grundlagen ergänzen:

1. GVim für vim außerhalb der Konsole und wie man sie installiert

Sie haben gefragt, ob vim nur über die Konsole ausgeführt werden kann. GVim (GUI-Vim) ist die eigenständige Version. Aus Ihrem Screenshot geht hervor, dass Sie Ubuntu verwenden. Sie können gvim im Software Center finden und von dort aus installieren. Alternativ können Sie sudo apt-get install gvimvon einem Terminal aus.

2. Erstellen einer .vimrc-Konfigurationsdatei

Es sieht so aus, als ob vim / gvim standardmäßig keine .vimrcfür Sie erstellt, sodass Sie selbst eine erstellen können. Öffnen Sie vim und geben Sie ein :e ~/.vimrc, um eine neue Datei zu bearbeiten, die .vimrcin Ihrem Home-Ordner aufgerufen wird ( ~)

Wir werden zunächst nur eine Einstellung hinzufügen, damit wir sehen können, ob es funktioniert hat. Fügen Sie den folgenden Text hinzu:

" switch on line numbering
set number

Das "ist das Kommentarzeichen.

Beenden Sie dann vim und starten Sie es neu. Sie sollten feststellen, dass oben links eine Zeilennummer 1 angezeigt wird und dass für jede Datei, die Sie von nun an bearbeiten, die Zeilennummerierung standardmäßig aktiviert ist.

3. Installieren eines Plugins

Plugins befinden sich in einem Ordner namens ~/.vim/, aber vim erstellt dies nicht standardmäßig, daher müssen Sie Folgendes festlegen:

mkdir ~/.vim

Im Laufe der Zeit .vimwächst der Ordner um mehrere Unterordner wie:

  • plugin für Plugins
  • color für Farbschemata
  • doc zur Dokumentation
  • syntax für Syntaxhervorhebungsmodi

Aber jetzt ist es leer. Fügen wir ein Plugin hinzu, um es auszuprobieren.

Beginnen Sie mit dem Öffnen von vim mit vim .- das weist vim an, einen Ordner im "Explorer" -Modus zu öffnen. Wir werden NERDtree installieren, ein beliebtes Dateibrowser-Plugin, das den Standard-Explorer ersetzt.

Gehen Sie zu http://www.vim.org/scripts/script.php?script_id=1658 und laden Sie die Zip-Datei aus der Tabelle unten auf der Seite herunter.

Öffnen Sie es im Archiv-Manager, wählen Sie "Extrahieren" und weisen Sie es an, es in Ihren ~/.vim/Ordner zu extrahieren . Möglicherweise müssen Sie im Ctrl+HOrdnerbrowser des Archivmanagers auf klicken, um versteckte Ordner anzuzeigen.

Sobald es extrahiert ist, werden mehrere Unterordner .vimfür Sie erstellt. Wenn Sie jetzt vim mit a neu starten

vim .

Sie sollten sehen, dass sich die Explorer-Ansicht geändert hat! Es verwendet jetzt das NERDtree-Plugin.

4. Weitere .vimrc-Einstellungen

Meine vollständige .vimrc ist hier verfügbar: https://bitbucket.org/hjwp/vim/src , aber hier sind einige Einstellungen, die ich wirklich nützlich finde:

" syntax highlighting
syntax on

" map cut & paste to what they bloody should be
vnoremap <C-c> "+y
vnoremap <C-x> "+x
map <C-v> "+gP

" sane text files
set fileformat=unix
set encoding=utf-8

" sane editing
set tabstop=4
set shiftwidth=4
set softtabstop=4

" convert all typed tabs to spaces
set expandtab

"autocompletion with ctrl+space
inoremap <c-space> <c-n>
inoremap <Nul> <c-n>

5. Ctags

Ich würde mir anfangs keine allzu großen Sorgen um Plugins machen. Nur die Leistung kennenzulernen, die vim Ihnen sofort bietet, sollte für Ihre Codierung bereits nützlich genug sein. Aber eine Sache, die wirklich nützlich ist, um in vim zu arbeiten, sind ctags . Mit ctags können Sie beispielsweise "Zur Definition springen" und alle Schlüsselwörter in Ihrem Quellbaum automatisch vervollständigen. beginnen mit:

apt-get install exuberant-ctags

Fügen Sie dann in Ihrer .vimrc hinzu

map <f12> :!ctags -R .<cr>

Wenn Sie jetzt in einer VIM-Sitzung auf "F12" klicken, wird eine .tagsDatei generiert , mit der VIM nach Schlüsselwörtern suchen kann.

Wenn Sie aktiviert sind, z. B. einen Funktionsaufruf in Ihrem Quellcode, können Sie ctrl+]zu dessen Definition springen. Weitere Infos hier: /programming/563616/vim-and-ctags-tips-and-tricks

6. Was kommt als nächstes?

Andere Leute haben einige wirklich nützlich aussehende Anleitungen gepostet. Hier sind ein paar SO-Seiten, die ich als nützlich empfunden habe:

Es ist eine ganze Vim-Welt da draußen. Aber: Warnung: Wenn Sie sich für Vim Golf interessieren, sind Sie wahrscheinlich zu weit gegangen - http://vimgolf.com/ ;-)


Ok, wie ich bereits erwähnt habe, gibt es keine .vimoder .vimrcDateien. Ich weiß, was das .tut, aber können Sie mir bitte zeigen, wie genau wir ein einzelnes Plugin installieren oder eine einzelne Einstellung ändern? Bitte helfen Sie! Danke
Gabriel

ah, ich denke, es ist möglich, dass vim nicht .vimrcstandardmäßig ein erstellt, und Sie müssten es selbst erstellen ... Ich werde die Antwort aktualisieren und auch etwas zur Installation eines Basis-Plugins hinzufügen ...
hwjp

1
ist das besser?
hwjp

wunderbare Hilfe von Ihnen, danke! ABER wie kann ich ein Plugin deinstallieren?
Lösche

Außerdem habe ich Pathogen installiert und meine .vimDatei ist überhaupt nicht organisiert. Irgendein nützliches htmlPlugin? Danke
Gabriel

9

Ich würde vorschlagen, dass Sie anfangen, .vimrc zu studieren, genau wie oben. Die Bedürfnisse und Vorlieben aller sind unterschiedlich, daher sollten Sie auf jeden Fall manuell etwas installieren, anstatt nur andere Konfigurationen zu kopieren.

Einige Ressourcen zum Erlernen von VIM selbst:

  • Lernen Sie Vim Progressive , eine großartige Anleitung zum Erlernen von Vim.
  • Vim Novice Tutorials , eine Reihe von Videos von Derek Wyatt Ich habe mich amüsiert, als ich meine Reise begann.
  • Spickzettel , wenn Sie Vim noch nicht kennen, würde ich empfehlen, dies wie eine Prüfung zu machen. Schreiben Sie die Tastenkombinationen auf ein Blatt Papier, den Befehl links und die Beschreibung rechts. Beginnen Sie dann mit dem Auswendiglernen, indem Sie entweder den Befehl oder die Beschreibung ausblenden und versuchen, sich an die Antwort zu erinnern. Es dauert nicht lange, bis die Befehle für Sie selbstverständlich sind. Denken Sie jedoch daran, sie auch in Vim aktiv zu verwenden, da Sie sonst schnell verlernen.
  • http://usevim.com (Evaluiert Vim-Plugins und hat auch eine Vim 101-Serie)
  • http://vimcasts.org/episodes/archive (Einige großartige Casts)

Einige wirklich nützliche Plugins

  • Syntastische statische Code-Analyse für Tonnen von Sprachen
  • vim-css3-syntax Syntaxhervorhebung für CSS3. Im Allgemeinen sollten Sie die Syntaxdateien auch für HTML5 und Javascript aktualisieren, wenn Sie sie verwenden.
  • Matchit Erweitert die Funktionalität von%
  • Surround- Zuordnungen für Tags / Klammern usw., sehr leistungsfähig für Webentwickler
  • Tcomment Kommentare können in den meisten Sprachen einfach umgeschaltet werden
  • Pathogen Halten Sie Ihren vim-Ordner organisiert, damit Sie Plugins deinstallieren und herumspielen können
  • NERDtree Ein sehr beliebter Baumforscher, obwohl ich persönlich nur Folgendes bevorzuge: e.
  • Command-T Ein beliebter Puffermanager, ich persönlich kann ihn nicht verwenden, da er von Ruby abhängt.
  • Snipmate Fügen Sie einfach Code-Schnipsel ein.
  • Sparkup Erweitern Sie div # stuff.class> ul> li * 5 in HTML, Sie erhalten die Drift.

Einige andere gut zu wissen

  • Um Tab-Vervollständigungen für Projekte zu erhalten, können Sie von vim unterstützte ctags verwenden
  • Binden Sie die Feststelltaste wieder an esc, und nach einem Tag können Sie nicht verstehen, wie Sie die Energie hatten, um bis esc zu gelangen.
  • Vim hat verzweigte Rückgängig-Bäume verzweigt, was bedeutet, dass Sie immer noch rückgängig machen können, obwohl Sie Ihren Rückgängig-Baum geändert haben. Gundo hilft Ihnen dabei, dies zu visualisieren.
  • Vim hat dauerhafte Rückgängigmachungen, was bedeutet, dass Ihr Rückgängig-Verlauf gespeichert wird, selbst wenn Sie Ihren Computer neu starten. Sie sollten dies auf jeden Fall aktivieren.
  • In meinem eigenen vimrc habe ich eine Funktion, die prüft, ob ich an einer Drupal- oder einer Wordpress-Site arbeite, abhängig davon, ob unterschiedliche Codekonventionen festgelegt sind. (Vermutlich könnte dies nützlich sein, um es zu wissen. Sie finden es in meinem unten verlinkten Repository.)
  • Steve Losh hatte diese großartige Konfiguration , die ein Zahlenobjekt in vim definiert, sodass Sie nur die Zahl in beispielsweise 200px löschen / ändern / etc können, indem Sie cN drücken

Vimrc-Repositories, die einen Besuch wert sind

  • Steve Losh Super Zeug
  • Tim Pope Schöpfer von Fugitive, Surround und Tonnen anderer Vim-Plugins
  • Oxy Mein eigenes Repository, in der README habe ich ein Beispiel zum Generieren von ctags für Drupal-Projekte.
  • Derek Wyatt Seine Screencasts haben mich gelehrt, dass man dort eine Menge cooler Sachen finden kann

Ok, auch wenn ich einige der oben erwähnten Plugins und Sachen verwenden möchte, wie kann ich sie verwenden? Mein vimrc-Ordner wo ist es? Danke
gabriel

1
@gabriel vimrcist eine Datei und .bezeichnet ein verstecktes Linux-Dateisystem. Sie müssen es erstellen, .vimrcwenn es nicht vorhanden ist, und es in Ihrem Home-Verzeichnis ablegen . .vimist der Ordner / das Verzeichnis, der das Plugin / Skript enthält. Möglicherweise müssen Sie es auch erstellen. Für die meisten dieser Skripte stehen Installationsanweisungen zur Verfügung. vim.org/scripts/script_search_results.php . Vim ist ein Texteditor, wenn Sie nicht mit Optimierungen und allen Fragen
vertraut sind.

@sagarchalise Ok, können wir nach dem Erstellen dieser Dateien die Funktionsweise von vim ändern?
Gabriel

@gabriel vimrcsollte grundsätzlich enthalten, was vim tun sollte, dh Syntaxhervorhebung, Tabulatoren / Leerzeichen, Zeilennummern usw. vim ist vim nur ein Textbearbeitungswerkzeug. Du machst es was du willst. Vim ist extrem leistungsfähig und optimierbar. Sie müssen jedoch die Modi und Befehle verstehen. vim.wikia.com/wiki/Example_vimrc siehe hier für Beispiel vimrc
sagarchalise

Wie binde ich die Feststelltaste an Escape (ich verwende kein Ubuntu) ?
Santosh Kumar

1

Sie können dies verwenden:

bash << (curl -s https://raw.github.com/wongyouth/vimfiles/master/install.sh )

Dies ist die Konfiguration meines Lehrers, in der Hoffnung, Ihnen zu helfen.

Eine Handvoll Plugins für vim, die alle in einem Bundle-Unterverzeichnis gespeichert sind, eine nützliche vim-Konfiguration, insbesondere für die Rails-Codierung. Alle Plugins sind als Submodule enthalten, sodass Sie Plugins in einem Befehl aktualisieren können, was das Leben einfacher macht.

Detail: Geben Sie hier die Linkbeschreibung ein


Und was genau können wir damit machen? Schön, aber ich bevorzuge manuelle Installationen, weil ich dann weiß, was ich eigentlich installiere!
Gabriel

Sie können die Verwendung und Vim-Plugins in den Submodulen unter diesem Link sehen: github.com/wongyouth/vimfiles
Clark
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.