Перевод статьи Фабьена Лассера «10 essential extensions for VS Code».
Я использую Visual Studio Code в качестве своего основного редактора кода уже больше двух лет. Раньше я работал с Sublime Text – отличной программой (особенно для перехода с Notepad++). Но ребята в Microsoft все время ударно трудятся над тем, чтобы сделать свой редактор самым лучшим, и ежемесячные обновления программы показывают, насколько они увлечены этим делом.
Итак, я выбрал этот редактор, но хороший редактор не имел бы смысла без хороших расширений. Я составил список из 10 (плюс еще немножко) моих фаворитов – расширений, без которых я не могу обойтись. Они сильно облегчают мой рабочий день и в долгосрочной перспективе позволяют мне экономить много времени. Я не расставлял их в определенном порядке.
Color Info
VS Code предоставляет маленькие окошки предпросмотра цветов в файлах CSS. Color Info дает вам возможность получить гораздо лучшее представление о цвете, на который наведена мышь, с указанием значений CMYK или альфа. Это расширение может работать даже как инструмент выбора цвета, что очень удобно.
:emojisens:
Мне нравятся эмодзи. Это расширение позволяет вам вставлять эмодзи напрямую или печатать их коды в ваших файлах. Скажем, вы хотите вставить эмодзи joystick. Просто начните набирать :joy и у вас всплывет окошко с автодополнением, которое позволит напрямую вставить иконку. Если вы наберете ::joy, расширение вставит :joystick: вместе с превьюшкой эмодзи. Это великолепно!
Git Blame
Как следует из названия, это расширение показывает git blame текущей выбранной строки в статус-баре.
Markdown All In One
Я обожаю разметку. Собственно, весь этот сайт [dev.to] побуждает к ее интенсивному использованию, поскольку построен с помощью Hugo. Данное расширение помогает вам писать разметку с помощью сочетания клавиш, например Cmd + B сделает текст жирным, а Cmd + I добавит курсивное начертание. Очень удобно!
Settings Sync
Если вам, как и мне, нравится работать на нескольких разных (иногда виртуальных) машинах, вам пригодится это расширение! Оно позволит вам синхронизировать ваши настройки и расширения благодаря загрузке/выгрузке Github Gist.
TODO Highlight
Как следует из названия, это расширение подсвечивает в коде TODO, FIXME и любые ключевые слова по вашему выбору. Просто наберите где-нибудь TODO:, и расширение подсветит не только его, но также и другие TODO, уже написанные где-нибудь в вашем проекте ранее.
Vetur
Это расширение — швейцарский нож для Vue. От автодополнения до сниппетов – это просто маст-хэв для любого фронтенд-разработчика.
Spell Right
Многоязычная, легковесная офлайн-проверка правописания. Spell Right для поиска ошибок использует ваши встроенные словари. Расширение может проверять правописание на любом языке (и даже на нескольких) где угодно в вашем проекте. Но будьте внимательны с большими файлами, поскольку иногда проверка может занять некоторое время. Обычно, по умолчанию, у меня проверка отключена. Ее можно просто вызвать, кликнув на иконку глаза в строке состояния.
EditorConfig for VS Code
Это довольно странно, но VS Code не поддерживает EditorConfig по умолчанию. Просто установите это расширение, и оно немедленно начнет прослушивать любой найденный файл .editorconfig.
Bookmarks
Этим расширением я пользуюсь постоянно! Bookmarks («закладки») это расширение, помещающие маленькие синие закладки на полях вашего файла. Это очень удобно, когда вам надо перемещаться между определенными позициями внутри файла или оставить напоминание где-нибудь в проекте. Для себя я настроил shift + cmd + = для установки закладки и shift + cmd + — для перехода к следующей. Благодаря этому я могу прыгать по файлам без необходимости убирать руки с клавиатуры. Это расширение также добавляет маленькую панель, где видны все активные закладки в текущем проекте. Маст-хэв.
Также достойны упоминания
AutoFileName
Это довольно простое расширение. Просто введите начало названия файла/директории, и оно автоматически дополнит это название. Действительно очень удобно, когда нужно указать на файл внутри node_modules.
cdnjs
Чаще всего я добавляю зависимости в мои Javascript-файлы с помощью Webpack. Но когда мне нужно что-то быстро смоделировать, это расширение прикрывает мне спину. С помощью выпадающего списка команд вы сможете вставлять URL или тэги скрипта/стиля всех библиотек, которыми управляет cdnjs. Довольно удобно.
Итак, это несколько расширений, которыми я пользуюсь ежедневно. Если у вас есть что добавить – поделитесь в комментариях!
[customscript]techrocks_custom_after_post_html[/customscript]
[customscript]techrocks_custom_script[/customscript]
UCU