Важные расширения VSCode для разработчиков JavaScript в 2019 году

Visual Studio Code — это легкий и мощный редактор исходного кода. Он работает на Windows, macOS и Linux.

как сделать визуальную студию сверхмощной для разработчиков JavaScript.

1. Автозакрытие тега

Автоматически добавляйте закрывающий тег HTML/XML, как это делает Visual Studio IDE или Sublime Text.

Автоматически добавлять закрывающий тег при вводе закрывающей скобки открывающего тега
После вставки закрывающего тега курсор находится между открывающим и закрывающим тегом.
Установите список тегов, который не будет автоматически закрываться
Автоматически закрывать самозакрывающийся тег
Поддержка автоматического закрытия тега как Sublime Text 3
Используйте сочетание клавиш или палитру команд, чтобы добавить закрывающий тег вручную.

2. Автоматический импорт

Автоматически находит, анализирует и предоставляет кодовые действия и завершение кода для всех доступных импортов. Работает с Typescript и TSX. Это очень полезно, когда вы работаете с приложениями Angular и React.

3. Автоматическое переименование тега

Автоматически переименовывать парные теги HTML/XML, как это делает Visual Studio IDE. Это помогает переименовать теги HTML.

4. Стоимость импорта

Это расширение будет отображать в редакторе размер импортированного пакета. Расширение использует веб-пакет с плагином babili-webpack-plugin для определения импортированного размера.

5. Живой сервер

Запустите локальный сервер разработки с функцией перезагрузки в реальном времени для статических и динамических HTML-страниц. Это помогает быстро разрабатывать веб-сайты.

Откройте проект и нажмите Go Live в строке состояния, чтобы включить или выключить сервер.

6. Лучшие комментарии

Это расширение поможет вам создавать в коде более понятные комментарии. Это поможет более эффективно читать и понимать код.

С помощью этого расширения вы сможете классифицировать свои аннотации на:

Оповещения
Запросы
TODO
Особенности
Закомментированный код также можно стилизовать, чтобы было понятно, что кода там быть не должно.
Любые другие стили комментариев, которые вы хотите, могут быть указаны в настройках.

7. Раскрашивание пары скобок

Это расширение позволяет идентифицировать совпадающие скобки с цветами. Пользователь может определить, какие токены сопоставлять и какие цвета использовать.

8. Фрагменты ES7 React/Redux/GraphQL/React-Native

Это расширение предоставляет фрагменты JavaScript и React/Redux в ES7 с функциями плагина Babel для VS Code. Это поможет вам создавать компоненты, состояния и т. д.

9. Угловые фрагменты

Это расширение для Visual Studio Code добавляет фрагменты для Angular для TypeScript и HTML.

10. ГитЛенс

GitLens дополняет возможности Git, встроенные в Visual Studio Code. Это поможет вам визуализировать авторство кода с первого взгляда с помощью аннотаций вины Git и линзы кода, беспрепятственно перемещаться и исследовать репозитории Git, получать ценную информацию с помощью мощные команды сравнения и многое другое.

Название текущей строки

Обвинение в сточной канаве

Наведение курсора

Подробности при наведении курсора

Изменения (diff) Hover

10. Вавилонский JavaScript

Подсветка синтаксиса JavaScript для ES201x, React JSX, Flow и GraphQL.

11. Просмотр CSS

Разрешить просмотр идентификатора CSS и строк класса в качестве определений из файлов HTML в соответствующий CSS. Позволяет заглянуть и перейти к определению.