10 лучших расширений VS Code для JavaScript-разработчиков

VS Code — мощный и удобный редактор кода, к тому же бесплатный, чем, вероятно, и объясняется его популярность. В него встроено множество функций, он поддерживает более 30 языков программирования, а количество расширений растет с небывалой скоростью. О десяти самых лучших из них для работы на JavaScript, по версии одного из пользователей сайта Cmsinstallation, рассказываем в новой подборке. 

1. ESLint

Инструмент для поиска и исправления ошибок в JavaScript-коде и ECMAScript. Может быть настроен для наиболее популярных фреймворков. Вместо того, чтобы вручную запускать ESLint и смотреть на ошибки, инструмент подключается к VS Code и подсвечивает их в редакторе. Устраняются ошибки сразу же обычным щелчком мыши.

С июля 2021 года VS Code поставляется со встроенной технологией IntelliSense, которая предлагает подсказки для кода. 

Ранее мы писали о том, как быстро научиться работать с ESLint. 

ESLint

2. ToDo Highlights 

Одно из самых популярных расширений VS Code. Плагин, который выделяет комментарии, если в них содержится слово ToDo или FixMe.

ToDo Highlights 

3. GitLens 

Есть много расширений для работы с Git, но то, что выделяет GitLens из общей массы, — это большое и активное сообщество и возможность детальной настройки. Как правило, GitLens используется на больших проектах, где позволяет быстро определять, кто написал конкретную строку (информация отображается в строке состояния) или влиять на объем справочных данных. 

GitLens

4. Styled components 

Расширение для тех, кто пользуется библиотекой styled-components в React. С помощью него можно изменять цвет кода.

Style and Components

5. VS Code Icons 

Расширение, которое содержит более 100 иконок для файлов. 

VS Code Icons

6. Bookmark 

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

Bookmark

7. Open in Browser 

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

Open in Browser 

8. VS Code Themes 

В интернете есть очень много тем для VS Code. Их цель — сделать код симпатичнее и при возможности снизить влияние цветовой схемы на глаза. О том, какая тема лучше — темная или светлая, мы писали ранее, а выбрать из нескольких вариантов свою можно здесь. 

9. Import Cost 

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

Import Cost

10. Prettier 

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

Может автоматически переформатировать код и привести его к требуемому стилю перед каждым выполнением команды git commit, поэтому подойдет при подготовке кода к отправке в репозиторий проекта. 

Prettier