📝 Мои расширения VS Code для Frontend Вчера увидел пост о расширениях в канале моего коллеги и решил поделиться своим списком расширений которыми пользуюсь каждый день. Вот они слева направо (сверху вниз): Auto Rename Tag - удобное переименование парных тегов. Если вы переименуете один из тегов открывающий или закрывающий, то второй переименуется автоматически. Babel JavaScript - подсветка синтаксиса JS с поддержкой всех современных возможностей Better Comments - удобная подстветка синтаксиса комментариев Code Spell Checker - проверка орфографии на английском языке. Этот спелчекер понимает разделение слов не только через пробелы но и другие стили такие как camelCase, kebab-case и т.д. Очень помогает не допускать досадных ошибок в написании переменных. В дополнение можно поставить поддержку многих других языков, например русский. DotENV - подстветка синтаксиса для файлов .env EditorConfig for VS Code - подсветка синтаксиса для .editorconfig Error Lens - более наглядный вывод ошибок, варнингов и инфо в вашем коде ESLint - поддержка ESLnt. Мастхэв любого фронтенд проекта. Например одна из киллерфич без которых я уже не знаю как жить это автоматическое исправление кода при сохранении файла в зависимости от правил вашего .eslintrc file-size - небольшое расширение показывающее в строке состояния вес открытого файла GitLens - мощная поддержка гита в вашем проекте (частично бесплатная). Разработчики этого расширения те же что у GitKraken - крайне удобного клиента для гита. Если у вас есть их лицензия, она подойдет и для этого расширения. Git Graph - в дополнение к GitLens я использую это расширение для работы с графом гита, т.к. в GitLens оно не входит в состав бесплатных функций i18n Ally - еще одно мастхэв расширение если вы работаете с множеством локализаций в вашем проекте. Оно сильно упростит вашу жизнь и нервы. Ранее я более подробно писал о нем пост. IntelliCode - удобно выдает подсказки по переменным, методам и т.д. когда вы что-то печатаете основываясь на вашем коде npm Intellisense - автокомплит импортов на основе вашего package.json Path Intellisense - автокомплит путей до файлов и директорий Material Icon Theme - добавляет множество иконок в ваше дерево проекта, сильно упростит вам жинь эксплоринге по дереву Quit Control for VSCode - микро-расширение защищяющее вас от случайного нажатия ⌘+Q Sublime Text Keymap - до VSCode я много пользовался саблаймом и очень привык к его хоткеям, это расширение позволяет быстро перенести их в ваш редактор GitHub Copilot - добавляет в VSCode поддержку copilot от GitHub. Умный помошник в написании кода (но платный). Подробнее о нем я писал ранее. GitHub Copilot Chat - ChatGPT но только для кодинга. Зачем заходить в гугл, если можно спросить в чате и получить ответ на любом языке и с примерами кода. К тому же чат понимает контекст и открытый в данный момент файл и может написать решение под вашу конкретную задачу в вашем стиле. 💻 P.S. Это были расширения которые я использую всегда и везде. А теперь немного расширений которые требуются в зависимости от проекта: Figma for VS Code - добавляет поддержку Figma внутри вашего редактора, просто откройте нужный вам макет в соседней от кода вкладке. Или используйте сплит, если ваш экран позволяет. ES7+ React/Redux/React-Native snippets - большой набор сниппетов если вы работаете с реактом GitLab Workflow - добавляет поддержку GitLab. Лично я использую только для быстрого создания Merge Request. GitHub Pull Requests and Issues - добавляет поддержку PR в GitHub. Позволяет удобно отслеживать и создавать пул реквесты в вашем рабочем репозитории, а так же состояние Actions Volar - поддержка синтаксиса Vue, расширение сделано разработчика самого VueJS поэтому работает отлично и поддерживает как 2 так и 3 версию Vue Peek - небольшое расширение позволяющее быстро перемещаться к компонентам через ⌘+Click Test Explorer UI - удобное расширения для работы с тестами 💻 P.P.S. Делитесь в комментариях своими любимыми расширениями!