Главное Свежее Вакансии Образование
Выбор редакции:
😼
Выбор
редакции
1 049 0 В избр. Сохранено
Авторизуйтесь
Вход с паролем

Популярные расширения Visual Studio Code

Расширяйте сознание с помощью книг, а возможности кода с помощью нашей статьи.

Code Time

Code Time — это плагин с открытым исходным кодом, который предоставляет метрики прямо в редакторе кода.

b_5c6feb146284b.jpg

После установки расширения будет предложено войти в панель управления. Если внутри редактора кода вы нажмете command + shift + P, откроется окно, в котором можно ввести Code Time, а затем выбрать между отображением данных в редакторе кода или в браузере.

Внутри браузера информация будет выглядеть так:

b_5c6feb147d932.jpg

Внутри браузера красочнее:

b_5c6feb1495fd0.jpgCode Time полезен, если вам нужно точно знать или просто интересно, сколько времени вы тратите на написание кода.

One Dark Pro

One Dark Pro одна из самых популярных и часто загружаемых тем для Visual Studio Code.

b_5c6feb14ad625.jpg

В этом примере видно, что у нас есть значки для каталогов, таких как клиент и сервер, а также для файлов, таких как .eslintrc .gitignore и package.json.

One Dark Pro поддерживается в React, Angular, Redux и множестве различных фреймворков и библиотек, предоставляя различные значки каталогов для компонентов, утилит, стилей, а также для редюсеров (Reducers), действий (Actions) и хранилищ (Store).

Bracket Pair Colorizer

Это расширение позволяет сопоставлять скобки с цветами. Это удобно, когда у вас есть глубоко вложенные объекты или функции, как показано здесь:

b_5c6feb14c3781.jpg

Color Highlight

Color Highlight показывает визуальное представление любого цветового кода. Например, если вы введете RGB, RGBa, шестнадцатеричный или любой другой цветовой код, можно увидеть цвет, как в этом примере:

b_5c6feb14d9e85.jpg

Path Intellisense

Path Intellisense — это плагин, который автоматически завершает имена файлов.

Это полезно для импорта компонентов в React, поскольку не нужно вручную вводить путь к файлу, который вы ищете.

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

Следующее расширение — ES7 React/Redux/GraphQL/React-Native фрагменты. Длинное название, но сэкономит вам много времени, особенно если вы используете его в React.

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

Прямо в редакторе кода можно нажать command + shift + P, а затем ES7 Snippet Search, вы увидите длинный список коротких команд, которые можно запустить, чтобы получить более длинные фрагменты кода.

b_5c6feb14f06fe.jpg

С помощью этого расширения можно легко найти команду, например, для фрагмента функционального компонента.Вы запускаете команды, набирая их в редакторе и нажимая ввод. Все просто!

GitLens — Git supercharged

GitLens расширяет возможности Git, встроенные в Visual Studio Code. Помогает с первого взгляда определить автора кода с помощью аннотаций Git-blame и code lens, легко перемещаться и изучать репозитории Git, получать ценные сведения с помощью команд сравнения и многое другое. Нажав на строку кода, вы увидите, кто его редактировал, когда его редактировали и в каком коммите.

Полезная вещь!

b_5c6feb15132f0.jpg

Перевод статьи My personal favorite Visual Studio Code extensions от Digital Skynet :)

0
В избр. Сохранено
Авторизуйтесь
Вход с паролем
Комментарии
Выбрать файл
Блог проекта
Расскажите историю о создании или развитии проекта, поиске команды, проблемах и решениях
Написать
Личный блог
Продвигайте свои услуги или личный бренд через интересные кейсы и статьи
Написать

Spark использует cookie-файлы. С их помощью мы улучшаем работу нашего сайта и ваше взаимодействие с ним.