Jak mogę dostosować Vima do tworzenia i programowania stron internetowych?

10

Próbowałem już znaleźć coś na moje pytanie w [askubuntu.com], ale nic nie odpowiadało moim potrzebom. Tak więc to, czego chcę, to zbudować vim jako bardzo potężny i użyteczny edytor dla HTML, CSS, javascript itp., Ale także do programowania. Próbuję nauczyć się css i ogólnie chciałem bardzo ładnego edytora z wieloma wtyczkami. Czy ktoś może mi pomóc, krok po kroku, w dostosowywaniu vima oraz o funkcjach, które mogą się rozejrzeć, które mogą mi pomóc w okresie nauki?

Aha, a jedyny sposób, w jaki działa vim, to z terminala? Dzięki

*** edycja ---> Nie mogę znaleźć pliku.vimrc

mój folder domowy

Gabriel
źródło

Odpowiedzi:

11

Wszyscy inni mają doskonałe porady, pomyślałem, że uzupełnię niektóre z podstawowych zasad:

1. GVim dla vima poza konsolą i sposób jego instalacji

Pytałeś, czy vim można uruchomić tylko z konsoli. GVim (GUI-Vim) to wersja autonomiczna. Z twojego zrzutu ekranu wygląda na to, że używasz Ubuntu, możesz znaleźć gvim w Software Center i zainstalować go stamtąd. Alternatywnie możesz to zrobić sudo apt-get install gvimz terminala.

2. Tworzenie pliku konfiguracyjnego .vimrc

Wygląda na to, że domyślnie vim / gvim nie tworzy .vimrcdla ciebie, więc możesz go stworzyć samodzielnie. Otwórz vima i wpisz, :e ~/.vimrcaby edytować nowy plik o nazwie .vimrcw folderze domowym ( ~)

Zaczniemy od dodania tylko jednego ustawienia, abyśmy mogli zobaczyć, czy zadziałało. Dodaj następujący tekst:

" switch on line numbering
set number

Jest "to znak komentarza.

Następnie zamknij vim i uruchom go ponownie - powinieneś zauważyć, że linia nr 1 pojawiła się w lewym górnym rogu i powinieneś zauważyć, że każdy plik, który edytujesz od teraz, ma domyślnie włączone numerowanie linii.

3. Instalowanie wtyczki

Wtyczki działają w folderze o nazwie ~/.vim/, ale znowu vim nie tworzy tego domyślnie, więc musisz to zrobić:

mkdir ~/.vim

Z czasem .vimfolder powiększy się o kilka podfolderów, takich jak:

  • plugin dla wtyczek
  • color dla schematów kolorów
  • doc do dokumentacji
  • syntax dla trybów podświetlania składni

Ale na razie jest pusty. Dodajmy jedną wtyczkę, aby ją wypróbować.

Zacznij od otwarcia vima za pomocą vim .- to mówi vimowi, aby otworzył folder w trybie „explorer”. Zainstalujemy NERDtree, popularną wtyczkę przeglądarki plików, która zastąpi domyślnego eksploratora.

Przejdź do http://www.vim.org/scripts/script.php?script_id=1658 i pobierz plik zip z tabeli u dołu strony.

Otwórz go w menedżerze archiwów, wybierz „wypakuj”, a następnie powiedz, aby rozpakował do twojego ~/.vim/folderu. Może być konieczne Ctrl+Hnaciśnięcie przycisku w przeglądarce folderów menedżera archiwów, aby wyświetlić ukryte foldery.

Po rozpakowaniu utworzy .vimdla Ciebie kilka podfolderów . Jeśli teraz ponownie uruchomisz vima za pomocą

vim .

Powinieneś zobaczyć widok eksploratora zmienił się! Teraz używa wtyczki NERDtree.

4. Więcej ustawień .vimrc

Mój pełny plik .vimrc jest dostępny tutaj https://bitbucket.org/hjwp/vim/src , ale oto kilka ustawień, które uważam za bardzo przydatne:

" 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

Na początku nie martwiłbym się zbytnio o wtyczki, po prostu poznanie mocy, którą oferuje vim od razu po wyjęciu z pudełka, powinno być już wystarczająco przydatne do kodowania. Ale jedną rzeczą, która naprawdę przydaje się w vimie, są ctags . ctags pozwala wykonywać takie czynności jak „przeskocz do definicji” i autouzupełnianie wszystkich słów kluczowych w drzewie źródłowym. zacząć od:

apt-get install exuberant-ctags

Następnie w swoim .vimrc dodaj

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

Teraz, kiedy naciśniesz „F12” w sesji vim, wygeneruje .tagsplik, którego vim może użyć do skanowania w poszukiwaniu słów kluczowych.

Teraz, jeśli jesteś włączony, np. Wywołanie funkcji w kodzie źródłowym, możesz użyć, ctrl+]aby przejść do jego definicji. Więcej informacji tutaj: /programming/563616/vim-and-ctags-tips-and-tricks

6. co dalej

Inne osoby opublikowały kilka naprawdę przydatnych przewodników, oto kilka stron SO, które uznałem za przydatne:

Tam jest cały świat vimów. Ale: ostrzeżenie: Jeśli znajdziesz się w golfie vim, prawdopodobnie posunąłeś się za daleko - http://vimgolf.com/ ;-)

hwjp
źródło
Ok, jak już wspomniałem wcześniej nie istnieją .vimlub .vimrcplików. Wiem, co to .robi, ale czy możesz mi pomóc, jak dokładnie zainstalować jedną wtyczkę lub zmienić jedno ustawienie? Proszę o pomoc! Dzięki
gabriel
ah, myślę, że jest możliwe, że vim nie utworzyłby .vimrcdomyślnie, a ty musisz zrobić to sam ... Zaktualizuję odpowiedź, a także zawierać informacje na temat instalacji podstawowej wtyczki ...
hwjp
1
czy to jest lepsze?
hwjp,
wspaniała pomoc od ciebie, dzięki ale jak mogę odinstalować wtyczkę Am I Usuwanie plików dzięki!?
Gabriel
Ponadto zainstalowałem patogen i mój .vimplik w ogóle nie jest zorganizowany. Jakaś przydatna htmlwtyczka? Dzięki
Gabriel
9

Sugeruję, abyś zaczął studiować .vimrc jest taki jak ten powyżej. Potrzeby i preferencje wszystkich osób są różne, dlatego zdecydowanie powinieneś ręcznie instalować rzeczy zamiast kopiować czyjeś konfiguracje.

Niektóre zasoby dotyczące uczenia się samego VIM:

  • Learn Vim Progressive , świetny przewodnik na temat nauki Vima.
  • Vim Novice Tutorials , seria filmów autorstwa Dereka Wyatta Dobrze się bawiłem, kiedy zaczynałem swoją podróż.
  • Ściągawka , jeśli nie znasz Vima wcześniej, polecam pójść na to jak na egzamin. Zapisz skróty klawiszowe na papierze, polecenie po lewej stronie i opis po prawej stronie. Następnie zacznij zapamiętywać, ukrywając polecenie lub opis i próbując zapamiętać odpowiedź. Nie trwa to długo, zanim polecenia przychodzą do ciebie naturalnie, ale pamiętaj, aby aktywnie używać ich również w Vimie, w przeciwnym razie szybko oduczycie się.
  • http://usevim.com (ocenia wtyczki vim i ma również serię Vim 101)
  • http://vimcasts.org/episodes/archive (kilka świetnych obsad)

Niektóre naprawdę przydatne wtyczki

  • Syntastyczna analiza kodu statycznego dla ton języków
  • vim-css3-syntax Podświetlanie składni dla CSS3. Zasadniczo powinieneś zaktualizować pliki składni również dla HTML5 i Javascript, jeśli ich używasz.
  • Matchit Rozszerza funkcjonalność%
  • Mapowania surround dla tagów / nawiasów itp., Naprawdę potężne dla twórców stron internetowych
  • Tcomment Z łatwością przełączaj komentarze w większości języków
  • Pathogen Utrzymuj porządek w folderze vim, abyś mógł odinstalować wtyczki i bawić się nimi
  • NERDtree Naprawdę popularny eksplorator drzew, choć osobiście wolę tylko: e.
  • Command-T Popularny menedżer buforów, osobiście nie mogę go używać, ponieważ zależy od ruby.
  • Snipmate Łatwo wstawiaj fragmenty kodu.
  • Sparkup Rozszerz div # stuff.class> ul> li * 5 na HTML, dostaniesz dryf.

Inne ważne informacje

  • Aby uzyskać uzupełnianie tabulatorów dla projektów, możesz użyć tagów, które obsługuje vim
  • Ponownie zamknij Caps Locka, aby uciec, po jednym dniu nie możesz zrozumieć, w jaki sposób miałeś energię, by dotrzeć do samego końca.
  • Vim ma rozgałęzione drzewa cofania, co oznacza, że ​​nadal możesz cofać, nawet jeśli zmieniłeś swoje drzewo cofania. Gundo pomaga to sobie wyobrazić.
  • Vim ma trwałe cofanie, co oznacza, że ​​zapisuje historię cofania, nawet jeśli ponownie uruchomisz komputer, zdecydowanie powinieneś to włączyć.
  • W moim vimrc mam funkcję, która sprawdza, czy pracuję na stronie Drupal lub Wordpress, w zależności od ustawionych różnych konwencji kodu. (Myślę, że to może być przydatne, możesz je znaleźć w moim repozytorium, do którego link znajduje się poniżej).
  • Steve Losh miał tę niesamowitą konfigurację definiującą obiekt liczbowy w vimie, więc możesz usunąć / zmienić / etc tylko liczbę w na przykład 200px, naciskając cN

Repozytoria Vimrc, które warto sprawdzić

  • Steve Losh Niesamowite rzeczy
  • Tim Pope Creator Fugitive, Surround i mnóstwo innych wtyczek vim
  • Oxy Moje własne repozytorium, w README mam przykład generowania ctagów dla projektów Drupal.
  • Derek Wyatt Jego screencasty nauczyły mnie vim, można tam znaleźć mnóstwo fajnych rzeczy
oksy
źródło
Ok, nawet jeśli chciałbym użyć niektórych wtyczek i rzeczy, o których wspomniałeś powyżej, jak mogę ich używać? Mój folder vimrc, gdzie to jest? Dziękuję
Gabriel
1
@ gabriel vimrcto plik .oznaczający ukryty system plików Linuksa, musisz go utworzyć, .vimrcjeśli go nie ma, i umieścić go w katalogu domowym. .vimto folder / katalog, który będzie zawierał wtyczkę / skrypt. Być może trzeba go również utworzyć. Większość tych skryptów ma dostępne instrukcje instalacji. vim.org/scripts/script_search_results.php . Vim jest edytorem tekstu, więc jeśli nie czujesz się dobrze z poprawkami
sagarchalise
@sagarchalise Ok, po utworzeniu tych plików możemy zmienić sposób działania vima?
Gabriel
@ gabriel zasadniczo vimrcpowinien zawierać to, co powinien zrobić vim, tj. podświetlanie składni, tabulacje / spacje, numery wierszy itp. Defaullt vim jest tylko narzędziem do edycji tekstu. Robisz to, co chcesz. Vim jest niezwykle potężny i można go modyfikować. Ale musisz zrozumieć jego tryby i polecenia. vim.wikia.com/wiki/Example_vimrc patrz tutaj, aby zobaczyć przykładowy vimrc
sagarchalizuj
Jak powiązać Caps Lock z Escape (nie używam Ubuntu) ?
Santosh Kumar
1

możesz użyć tego:

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

To jest konfiguracja mojego nauczyciela, która chce ci pomóc.

Garść wtyczek dla vima, wszystkie utrzymywane w jednym podkatalogu pakietu, przydatna konfiguracja vima, szczególnie do kodowania Railsów. Wszystkie wtyczki są zawarte jako podmoduły, dzięki czemu możesz zaktualizować wtyczki za pomocą jednego polecenia, które ułatwia życie.

szczegół: wprowadź opis linku tutaj

Clark
źródło
Co dokładnie możemy z tym zrobić? Fajnie, ale wolę instalacje ręczne, ponieważ wtedy wiem, co właściwie instaluję!
Gabriel
Możesz zobaczyć wtyczki użytkowania i vim zawarte w submodułach w tym linku: github.com/wongyouth/vimfiles
clark