Как стать автором
Обновить

.vimrc для фронтендера

Время на прочтение4 мин
Количество просмотров22K
Привет, я занимаюсь фронтенд разработкой, и как-то так сложилось, что в своей повседневной работе активно использую vim.

В процессе работы накопился довольно большой, неплохо документированный конфиг, и в какой-то момент мне захотелось поделиться им с внешним миром, и возможно, что-нибудь в нем улучшить. Он может быть полезен не только веб разработчикам, но и в общем-то всем остальным.

Под катом я опишу основные фишки конфига. Vim использую в связке c iTerm и темой solarized, но конфиг с минимальными изменениями подходит для любого терминала и любой темы. Из-за подробного описания каждой опции он будет очень полезен для тех, кто по каким-то причинам решил перейти на вим недавно.

Как ни странно — в статье много картинок ;)


Фишки конфига


Краткое описание каждой опции или плагина


Обычно, конфиг для вима или очень минималистичный, или очень сложный для понимания, если ты не в теме. Если ты новичок, то ты сталкиваешься с двумя проблемами сразу:

  1. Как это настроить
  2. Как этим вашим вимом пользоваться (использование не настроенного вима добавляет много-много незабываемых минут на старте)

С решением второй проблемы я ничем помочь не могу, зато могу помочь решить первую — конфиг разбит на понятные блоки, и каждая опция или плагин кратко прокомментированы.

Установка Плагинов


В качестве менеджера плагинов используется vundle.
При первом заходе в vim, он установится автоматически и поставит все необходимые плагины.
Физически плагины будут находиться в

~/.vim/bundle

Список самих плагинов находится в .vimrc файле.

В нем указаны пути до репозиториев, откуда нужно забирать плагины. Если в качестве пути указанно только имя пользователя и название репозитория:

Bundle 'altercation/vim-colors-solarized'

То оно автоматически разворачивается в путь до гитхаба.

https://github.com/altercation/vim-colors-solarized

После добавления какого-то нового плагина в список, нужно сказать vundle чтобы он поставил его, а заодно и обновил существующие. Это делается командой :BundleInstall

Предустановленные полезные плагины


Vim-snipmate + Vim-snippets

Один из самых популярных плагинов для поддержки сниппетов, и куча стандартных сниппетов к нему. Подстановка происходит по нажатию на Tab.
Например если напечатать fun и нажать Tab то fun раскроется в объявление функции, а курсор переместится на первый аргумент сниппета - function_name:

Переход между аргументами сниппета происходит также по Tab
Сразу есть очень много уже готовых сниппетов для целой кучи языков. Они находятся тут:

~/.vim/bundle/vim-snippets/snippets/

Этот путь появляется после первого запуска vim.
В файле с названием _.snippets находятся сниппеты, которые могут быть полезны независимо от языка — например сниппет вставляющий копирайт или рыбный текст.

Syntastic

Он позволяет подключить множество статических анализаторов и проверять код на ошибки при сохранении и открытии файла.
По умолчанию вместе с конфигом устанавливается только jshint (для этого необходимо, чтобы у вас уже был установлен npm).

При нахождении ошибки, слева в окне появляются метки, указывающие на строку с ошибкой, а если курсор уже находится на строке с ошибкой, то её текст пишется в строке состояния вима.


Tcomment_vim

Небольшой плагин, который добавляет хоткеи для работы с комментариями:

  • gcc — переключает состояние комментарий/не комментарий, для текущей строки
  • gc то же самое но для выделенного блока текста.


NERDtree

Добавляет в vim возможность отображать каталоги, как древовидную структуру.

Их можно открывать в соседнем табе по нажатию на t или в текущем — по Enter

Если выбрать какую-нибудь папку или файл, и нажать m то можно будет его удалить, переименовать, или сделать что-то еще, что мы обычно хотим делать с файлами.

Конфиг добавляет несколько удобных хоткеев — например по \f можно открыть split-view, в котором будет выделен текущий файл.
При выборе другого файла в этом split-view, он откроется в этом же окне. Этим удобно пользоваться при большом окне консоли.


Fugitive

Позволяет делать все необходимые операции с гитом сразу из вима. В конфиге по дефолту есть несколько полезных элиасов, чаще всего пользуюсь:

  • \b — посмотреть blame для текущей строки
  • \g — показывает в сплите статус текущей ветки
  • :Gdiff — показывает в splitview дифф сделанных изменений


FuzzyFinder

Позволяет быстро и удобно находить файлы и папки. Он поймет, что нужно искать, даже если вводить слова с очепятками, ошибками, неправильными путями и.т.д.

Хоткей для открытия ctrl+t

Из серьезных недостатков — значительный лаг при первом поиске в больших каталогах.

Другие плагины

Из достаточно интересных, но до сих пор не названных, остались еще Vim-surround и Vim-unimpaired, кроме них есть еще несколько других, полный список можно найти в файле конфига.
Все плагины уже готовы к работе.

Разная форма крусора для insert и command mode


Курсор в insert mode меняет свою форму с кирпичика, на пайп, тем самым экономя мне большое количество нервных клеток.

Код специфичен для iTerm, но это можно настроить, наверное, для любого терминала

Крутая и щадящая для глаз тема Solarized


Использую светлую ее версию в связке с аналогичной темой для iterm
Именно она видна на всех скриншотах в этом посте.

Если по каким-то причинам она вам не подходит, или вы хотите поставить что-нибудь своё, ее всегда можно убрать из конфига удалив бандл 'altercation/vim-colors-solarized' и раздел с заголовком Solarized

Мелкие полезные фишки


  • Показываются trailing spaces, табы и некоторые другие символы, которые в обычной ситуации не отображаются

  • Настроенны умные отступы, можно нажать == на выбранной строке и в 99 процентах случаев vim автоматически сделает все отступы правильными.
  • Подсветка найденных результатов сбрасывается при нажатии на Enter.
  • Отдельный хоткей для включения/выключения paste mode — \p. Этот режим нужен при вставке больших кусков кода из буфера обмена.
  • После повторного открытия файла позиция курсора в нем восстанавливается. То есть, если закончил его редактировать на 69 строке, при повторном открытии файл откроется именно на 69 строке.
  • Убраны большинство надоедливых предупреждений, на мой взгляд они только мешают.
  • При использовании vimdiff, не отображаются изменения в пробельных символах.


В Планах


Добавить умный автокомплит для javascript. Пока его нет, но я думаю что он появится в самое ближайшее время.

Где взять? :)


Посмотреть репозиторий и забрать конфиг можно тут: github.com/L0stSoul/vim-config
Теги:
Хабы:
Всего голосов 24: ↑22 и ↓2+20
Комментарии30

Публикации

Истории

Ближайшие события

15 – 16 ноября
IT-конференция Merge Skolkovo
Москва
22 – 24 ноября
Хакатон «AgroCode Hack Genetics'24»
Онлайн
28 ноября
Конференция «TechRec: ITHR CAMPUS»
МоскваОнлайн
25 – 26 апреля
IT-конференция Merge Tatarstan 2025
Казань