Код Visual Studio распространяется бесплатно. Построен на основе открытого исходного кода. Работает везде IDE. Посетите https://code.visualstudio.com/ для загрузки.

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

О
Простые расширения для React, Redux и Graphql в JS / TS с синтаксисом ES7

Как установить

Visual Studio Marketplace

Запустите Quick Open:

Вставьте следующую команду и нажмите Enter:

ext install dsznajder.es7-react-js-snippets

Использование

Это расширение сокращает время, которое вы тратите на написание повторяющегося шаблона, и дает вам удобный ярлык для создания этих фрагментов. Например, набрав rnstyle и нажав Tab на клавиатуре, вы создадите шаблон React Native Style. const styles = StyleSheet.create({})

rfc

import React from 'react'

export default function $1() {
  return <div>$0</div>
}

Реагировать на собственные инструменты

О компании

Это расширение VS Code предоставляет среду разработки для проектов React Native. С помощью этого расширения вы можете отлаживать свой код и быстро запускать react-native команды из палитры команд. - Расширение

Как установить

Прежде чем продолжить, убедитесь, что вы:

Использование

Я рекомендую прочитать начальную страницу расширения, так как она содержит подробное руководство.

React Refactor

О компании

Как установить



React Refactor - Visual Studio Marketplace
Английский | 简体 中文 Удалить компоненты и их ссылки: удалить выбранные компоненты и их ссылки в текущем… marketplace.visualstudio.com



ESlint

О компании

ESLint статически анализирует ваш код, чтобы быстро находить проблемы. ESLint встроен в большинство текстовых редакторов, и вы можете запускать ESLint как часть конвейера непрерывной интеграции. - eslint.org

Как установить

Торговая площадка Visual Studio

Использование

Руководство по началу работы

Красивее

О компании

Prettier - придирчивый программист. Он обеспечивает согласованный стиль, анализируя ваш код и повторно распечатывая его со своими собственными правилами, которые принимают во внимание максимальную длину строки, при необходимости упаковывая код. - красивее

Как установить

Устанавливать через расширения VS Code. Искать Prettier - Code formatter

Торговая площадка Visual Studio Code: Prettier - Средство форматирования кода

Также может быть установлен в VS Code: запустите VS Code Quick Open (Ctrl + P), вставьте следующую команду и нажмите Enter.

ext install esbenp.prettier-vscode

Проверка орфографии кода

Базовая проверка орфографии, которая хорошо работает с кодом camelCase.

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

Установите: https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker

Гитленс

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

Установите: https://marketplace.visualstudio.com/items?itemName=eamodio.gitlens

Выделить соответствующий тег

Это расширение выделяет совпадающие открывающие и / или закрывающие теги. При желании он также показывает путь к тегу в строке состояния. Несмотря на то, что VSCode имеет базовое сопоставление тегов, это просто базовое значение. Это расширение будет пытаться сопоставлять теги где угодно: из атрибутов тегов, внутри строк, в любых файлах, а также предоставляет обширные параметры стиля для настройки того, как теги выделяются. - Страница расширения

Установите: https://marketplace.visualstudio.com/items?itemName=vincaslt.highlight-matching-tag

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

Автоматическое переименование парного тега HTML / XML

Установите: https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-rename-tag

Кронштейны пары

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

Установите: https://marketplace.visualstudio.com/items?itemName=CoenraadS.bracket-pair-colorizer

Цветовая подсветка

Это расширение стилизует CSS / веб-цвета в вашем документе.

Установить:

В VSC нажмите Ctrl + Shift + P (Cmd + Shift + P на Mac), затем введите «› ext install », нажмите Enter, найдите« Color Highlight ».