Есть несколько расширений, которые мне очень нравятся, и они полезны при написании приложений React в VS Code. Пойдем прямо к ним.

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

Имя говорит само за себя. Это расширение автоматически добавляет закрывающий тег HTML / XML.

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

Кроме того, название говорит о том, что он делает - автоматически переименовывает парный тег HTML / XML.

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

Это расширение предоставляет вам фрагменты JavaScript и React / Redux в ES7 с функциями плагина Babel для VS Code. На самом деле это самый используемый (для меня). Каждый раз, когда мне нужно создать новый компонент, я просто пишу rce (для компонента класса) или rfce or rfc (для функциональных компонентов), а расширение сделает все остальное. Есть еще много полезных фрагментов, которые объясняются здесь.

4. ESLint

Это настраиваемый инструмент линтера, который определяет шаблоны в JS и сообщает о них. Любую проблему, которую обнаружит это расширение, можно исправить автоматически. Исправления учитывают синтаксис, поэтому традиционные алгоритмы поиска и замены не вызывают ошибок.

5. GitLens - Git с наддувом

GitLens расширяет возможности Git, встроенные в Visual Studio Code. Я тоже использую его все время. Каждая фиксация проходит через это расширение. Легко перемещаться по репозиториям и веткам Git. Никогда не было проблем с этим.

6. Prettier - средство форматирования кода

У кого время форматирует код? Почему бы просто не нажать Ctrl + S, и Prettier сделает все волшебство. Я говорю как продавец, но мне очень нравится, как все автоматически выравнивается. Prettier - придирчивый программист. Он обеспечивает согласованный стиль, анализируя ваш код и повторно распечатывая его со своими собственными правилами, которые принимают во внимание максимальную длину строки, при необходимости упаковывая код.

7. Радужные скобки

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

8. Тема значка материала

Я думаю, что все знают об этом. Это расширение для настройки значков в VS Code. Ничего особенного, просто после установки намного легче ориентироваться в проекте.

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

Расширение Better Comments поможет вам создавать в коде более понятные для человека комментарии. С помощью этого расширения вы сможете разделить свои аннотации на следующие категории: предупреждения, запросы, TODO, выделения или любые другие стили комментариев, которые вы хотите, можно указать в настройках. Кроме того, закомментированный код также можно стилизовать, чтобы было ясно, что кода там не должно быть.

10. Темная тема Atom One

Это не расширение, которое поможет вам писать код, так как это тема, но я экспериментировал с парой из них, и это, безусловно, мое любимое. Долгое время я использовал Tokyo Night Storm (голубоватый), но сейчас я предпочитаю именно этот.