- Интеграция Git с Visual Studio Code
- Требования
- 1: Вкладка Source Control
- , и сохраните его.
- 2: Интерпретация индикаторов gutter
- . После этого вы увидите синюю вертикальную метку в желобе напротив измененной строки. Вертикальная синяя метка означает, что соответствующая строка кода была отредактирована.
- 3: Определение отличий между версиями файла
- 4: Работа с ветками
- 5: Работа с удаленными репозиториями
- 6: Установка расширений
- Git Blame
- Git History
- Git Lens
- Заключение
- Git, GitHub и Visual Studio. В помощь новичкам
- О чем:
- Внимание:
- Для кого:
- О тексте:
- Инструкция:
- Дополнительно:
- Интерфейс GIT в Visual Studio
- Использование GIT в Visual Studio
- Создание репозитория GIT
- Клонирование существующего репозитория GIT
- Открытие существующего локального репозитория
- Просмотр файлов в обозревателе решений
- Окно «Изменения GIT»
- Выбор существующей ветви
- Создание ветви
- Окно «Репозиторий GIT»
- Управление ветвями
- Входящие и исходящие фиксации
- Сведения о фиксации
- Разрешение конфликтов слияния
- Редактор слияния
- Настройка параметров GIT
- Использование всех возможностей Team Explorer в Visual Studio
- Что дальше?
Интеграция Git с Visual Studio Code
В веб-разработке Visual Studio Code (VS Code) стал одним из самых популярных редакторов. Он приобрел такую популярность благодаря множеству встроенных функций, среди которых есть и интеграция системы управления версиями Git. Использование Git через VS Code может сделать ваш рабочий процесс более эффективным и надежным.
В этом мануале мы расскажем, как использовать интеграцию системы управления версиями Git в VS Code.
Требования
- Установка Git (инструкции вы найдете в мануале Разработка проектов с открытым исходным кодом: начало работы с Git).
- Последняя версия Visual Studio Code.
1: Вкладка Source Control
Первое, что вам нужно сделать, чтобы ознакомиться с преимуществами интеграции системы управления версиями, – это инициализировать проект как репозиторий Git.
Откройте Visual Studio Code и запустите встроенный терминал. Вы можете открыть его с помощью сочетания клавиш CTRL+` (в Linux, macOS или Windows).
В терминале создайте каталог для нового проекта и перейдите в него:
Затем создайте репозиторий Git:
Есть и другой способ сделать это в Visual Studio Code: в левой панели нужно открыть вкладку Source Control (значок выглядит как развилка). Затем выберите Open Folder – и в текущем каталоге откроется файловый менеджер. Выберите нужный каталог проекта и нажмите Open.
Затем выберите Initialize Repository.
После этого проверьте свою файловую систему, и вы увидите, что она включает каталог .git. Чтобы убедиться в этом, с помощью терминала перейдите в каталог проекта и запросите все его содержимое:
Вы увидите созданный каталог .git:
После инициализации репозитория создайте файл index.html.
После этого в панели Source Control вы увидите новый файл с буквой U рядом с ним. Символ U означает, что файл неотслеживаемый (untracked) – этот новый или отредактированный файл еще не добавлен в репозиторий.
Теперь вы можете нажать кнопку с плюсом (+) рядом с файлом index.html, чтобы отслеживать файл по репозиторию.
После добавления файла в репозиторий буква U рядом с файлом изменится на A. Символ A (added) представляет новый файл, который был добавлен в репозиторий.
Чтобы зафиксировать изменения, введите сообщение о коммите в поле ввода в верхней части панели Source Control. Затем кликните значок check, чтобы отправить коммит.
После этого вы увидите, что у вас нет изменений, ожидающих проверки и сохранения.
Затем добавьте немного кода в файл index.html.
Для создания скелета HTML5 в VS Code можно использовать плагин Emmet, нажав клавиши !+Tab. Добавьте что-нибудь в , например, заголовок
, и сохраните его.
В панели Source Control вы увидите, что ваш файл изменился. Рядом с ним будет отображаться буква M (modified), которая указывает на отредактированный файл
Это изменение можно также сохранить через коммит.
Теперь, когда вы знакомы с панелью Source Control, мы можем переходить к индикаторам gutter.
2: Интерпретация индикаторов gutter
На этом этапе мы рассмотрим индикаторы gutter, или индикаторы желоба. Желоб – это узкая область, которая находится между индикатором строк и кодом.
Если ранее вы использовали сворачивание кода, то знаете, что значки разворачивания и сворачивания кода расположены именно в области желоба.
Начнем с внесения небольших изменений в файл index.html – можно, например, изменить контент в теге
. После этого вы увидите синюю вертикальную метку в желобе напротив измененной строки. Вертикальная синяя метка означает, что соответствующая строка кода была отредактирована.
Теперь попробуйте удалить одну из строк в разделе вашего файла index.html. Обратите внимание на красный треугольник в желобе. Красный треугольник указывает на строку или группу строк, которые были удалены.
Теперь перейдите к нижней части раздела и добавьте туда новую строку кода. Обратите внимание на вертикальную зеленую полосу – она указывает на добавленную строку кода.
3: Определение отличий между версиями файла
VS Code также может сравнивать версии кода. Как правило, для этого нужно загружать специальный инструмент, но в VS Code есть встроенная функция, и она поможет вам работать более эффективно.
Чтобы просмотреть отличия между версиями файла, откройте панель управления исходным кодом Source Control и дважды кликните на измененный файл. В нашем случае нужно дважды кликнуть на файл index.html. На экране появится сравнение текущей версии файла (слева) и его предыдущей версии (справа).
4: Работа с ветками
В нижней панели вы можете создавать и переключать ветки. Если вы посмотрите в самый нижний левый угол редактора, вы увидите значок управления версиями (он выглядит как развилка), рядом с которым будет указано имя текущей рабочей ветки (например, master).
Чтобы создать нову ветку, кликните на имя текущей ветки. На экране должно появиться меню, дающее вам возможность создать новую ветку.
Для примера создайте новую ветку под названием test.
Теперь внесите изменения в свой файл index.html, чтобы обозначить, что вы находитесь в новой ветке: например добавьте текст «this is the new test branch».
Сохраните эти изменения в ветке test с помощью коммита. Затем снова кликните на имя ветки в левом нижнем углу, чтобы вернуться к ветке master.
После переключения на ветку master вы заметите, что текст «this is the new test branch», сохраненный в ветке test, не присутствует в вашем файле.
5: Работа с удаленными репозиториями
В этом руководстве мы не будем подробно останавливаться на удаленных репозиториях.
С помощью панели управления Source Control у вас есть доступ к удаленным репозиториям. Если вы работали с такими репозиториями ранее, вы найдете здесь знакомые команды, такие как pull, sync, publish, stash и т.п.
6: Установка расширений
VS Code не только предоставляет множество встроенных функций для Git, но также позволяет установить несколько очень популярных расширений для расширения набора функций.
Git Blame
Расширение Git Blame предоставляет возможность просматривать информацию состояния для текущей выбранной строки.
Название этого расширения может прозвучать пугающе, но Git Blame не предполагает, что вы будете буквально винить или стыдить кого-то в изменении кода: практичность расширения заключается в том, что оно позволяет выяснить, кому можно задать вопросы по определенным фрагментам кода.
Это расширение выводит в нижней панели инструментов небольшое сообщение, относящееся к текущей строке кода, из которого вы можете узнать, кто и когда внес изменение.
Git History
Просматривать текущие изменения, отслеживать разницу между версиями и управлять ветками можно и с помощью встроенных функций VS Code, однако они не предоставляют подробной истории Git. Расширение Git History решает эту проблему.
Это расширение позволяет тщательно изучить историю файла, автора, ветки. Чтобы активировать окно Git History, нужно кликнуть на файл правой кнопкой мыши и выбрать Git: View File History.
Кроме того, вы можете сравнивать ветки и коммиты, создавать ветки из коммитов и многое другое.
Git Lens
Git Lens расширяет возможности Git, встроенные в Visual Studio Code. Этот плагин помогает с первого взгляда определить авторство кода с помощью аннотаций Git blame и линзы кода, перемещаться по репозиториям Git и исследовать их, получать ценную информацию с помощью команд сравнения и многое другое.
Расширение Git Lens – одно из самых популярных и мощных. В большинстве случаев его функциональность может заменить каждое из двух предыдущих расширений.
Получить информацию, как в Git Blame, можно справа от строки, над которой вы сейчас работаете: над ней появляется небольшое сообщение, из которого становится известно, кто и когда внес изменение и отправил коммит. При наведении курсора на это сообщение появляется дополнительная информация: изменение кода, временная метка времени и т.п.
Это расширение предоставляет множество функций, позволяющих получить историю Git, в том числе легкий доступ к множеству опций (отображение истории файлов, просмотр различий между версиями и многое другое). Чтобы открыть эти параметры, вы можете кликнуть на текст в строке состояния (он содержит информацию об авторе, который редактировал строку кода, и о времени последней редакции).
Это расширение обладает множеством функций, и вам, вероятно, потребуется время, чтобы разобраться со всеми ними.
Заключение
В этом мануале вы узнали, как использовать интеграцию системы управления версиями Git с VS Code.
VS Code «из коробки» предлагает многие функции, для которых ранее требовалась загрузка отдельного инструмента.
Источник
Git, GitHub и Visual Studio. В помощь новичкам
О чем:
В ней будет коротко рассмотрено что это за вещи, зачем нужны, и простой способ работы – из среды Visual Studio. То есть Bash или GitHub клиент использоваться не будут.
Внимание:
На Хабре уже есть похожая статья – [вот она]. В своей публикации я дополню слова Алексея и расскажу метод проще.
Для кого:
Статья направлена в помощь людям которые не работали с Git, GitHub, и хотят освоить в общих чертах как можно быстрее и без сложностей начать работу с ними.
О тексте:
Старался писать проще и с большим количеством скриншотов и пояснений. Ведь лучше, когда они есть чем, когда их нет и о чем-то приходится догадываться.
Итак, немного теории чтоб понять, что делать дальше:
- Git и GitHub – связаны, но они не одно и то же.
Git – распределенная система контроля версий. Можете представить, как механизм резервного копирования, сохранения в играх. То есть в любой момент вы можете вернуться к предыдущему состоянию и попробовать сделать что-то иначе.
Распределенная значит что все данные хранятся не только у вас, но и на сервере (GitHub), у других участников команды (если таковая имеется).
Если непонятно, можете посмотреть — www.youtube.com/watch?v=w3jLJU7DT5E - Терминология тоже имеется на ней внимание не заостряю, не о том сейчас.
Что нужно:
- Visual Studio 2015 года или новее
- Подключение к интернету
- Несколько гигабайт памяти на жестком диске
Инструкция:
- Переходим в меню Tools → Extensions and Updates → откроется вкладка Installed → если в расширениях отсутствует «GitHub Extension for Visual Studio» идем дальше, иначе перейдите к пункту следующему пункту инструкции → вкладка Online → ищем в поиске наше расширение → скачиваем и устанавливаем.
На аккаунте GitHub создаем новый репозиторий. Смотрим:
После, с GitHub копируем ссылку:
Нажимаем на стрелку внизу, и мы попадем в меню. В нем вставляем ссылку на репозиторий созданий ранее:
Если репозиторий пустой все пройдет как надо. В моем случае там уже лежит один проект созданий специально чтоб вызвать ошибку. Он не имеет с этим ничего общего, даже файлы разные.
Выходов из ситуации несколько, я рассмотрю только один из них — создание новой ветки [другой путь разработки, тестовый полигон. По умолчанию установлена ветка “master”] в репозитории для этого делаем следующее:
- Может возникнуть вопрос – Что значат другие иконки?
Ответ:
Карандаш для того чтоб фиксировать изменения локально (commit). Используйте когда есть что сохранить, то есть код или файлы изменились.
Все остальные тоже играют важную роль:
Создали решение с каким-то проектом→добавили в git→зафиксировали изменение (commit – иконка карандаша)→если есть проблемы поправляем по ситуации(код изменили[статья Алексея] либо новую ветвь создали[смотри пред. пункт], назад по истории сохранений (коммитов) вернулись[след. пункт], либо спросить на toster.ru или stackoverflow.com)→проект на GitHub;
Дополнительно:
Чтоб GitHub верно отображал русские комментарии (если есть) при просмотре кода через сайт нужно сделать следующее:
Cоветую всё-таки изучить Git Bash.
Я старался писать как можно понятнее, если что-то не так, то поправьте в комментариях!
На этом все. Спасибо за внимание!
Источник
Интерфейс GIT в Visual Studio
Теперь GIT является интерфейсом системы управления версиями по умолчанию в Visual Studio 2019. Начиная с версии 16.6 мы работаем над созданием набора функций на основе ваших отзывов. Новый интерфейс Git по умолчанию включен для всех пользователей, имеющих выпуск версии 16.8.
GIT — это наиболее широко используемая современная система управления версиями, которая может быть полезна как профессиональным разработчиком, так и только начинающим изучать программирование. Если вы не знакомы с GIT, можно начать с веб-сайта https://git-scm.com/. На нем вы найдете памятки, популярную электронную книгу и видеоматериалы по основам GIT.
Использование GIT в Visual Studio
Мы подробно расскажем вам о том, как использовать новый интерфейс Git в Visual Studio 2019. Однако если вы хотите ознакомиться с кратким обзором, посмотрите следующее видео:
Длительность видео: 05:27 мин.
Существует три способа начать использование Git в Visual Studio для повышения производительности:
- Открытие существующего репозитория GIT. Если у вас уже есть код на компьютере, его можно открыть с помощью пункта меню Файл >Открыть >Решение/проект (или Папка). Visual Studio автоматически определяет, имеется ли инициализированный репозиторий GIT.
- Создание нового репозитория GIT. Если ваш код не связан с GIT, можно создать новый репозиторий GIT.
- Клонирование существующего репозитория GIT. Если код, с которым вы хотите работать, не находится на вашем компьютере, можно клонировать любые существующие удаленные репозитории.
Начиная с версии 16.8 Visual Studio 2019 включает полностью интегрированный интерфейс для работы с учетными записями GitHub. Теперь вы можете добавить в цепочку ключей учетные записи GitHub и GitHub Enterprise. Вы сможете добавлять и использовать их так же, как и учетные записи Майкрософт. Это позволит упростить доступ к ресурсам GitHub в Visual Studio. Дополнительные сведения см. на странице Работа с учетными записями GitHub в Visual Studio.
Создание репозитория GIT
Если ваш код не связан с GIT, можно начать с создания нового репозитория GIT. Для этого в строке меню выберите GIT > Создать репозиторий GIT. Затем в диалоговом окне Создание репозитория GIT введите свои данные.
С помощью диалогового окна Создание репозитория GIT можно легко отправить новый репозиторий в GitHub. По умолчанию новый репозиторий является частным. Это означает, что доступ к нему есть только у вас. Если снять соответствующий флажок, репозиторий будет общедоступным. Это означает, что любой пользователь в GitHub сможет его просмотреть.
Независимо от того, является ли репозиторий общедоступным или частным, лучше создать удаленную резервную копию кода, которая будет безопасно храниться в GitHub, даже если вы работаете сами по себе. Это также позволит вам получать доступ к коду с любого компьютера.
Вы можете создать исключительно локальный репозиторий GIT, выбрав параметр Только локальный. Вы также можете связать локальный проект с любым существующим пустым удаленным репозиторием, размещенным в Azure DevOps или у любого другого поставщика Git, с помощью параметра Существующий удаленный репозиторий.
Клонирование существующего репозитория GIT
В Visual Studio процесс клонирования прост. Если вы знаете URL-адрес репозитория, который нужно клонировать, можно вставить его в разделе Расположение репозитория, а затем выбрать место на диске, в которое будет клонирован репозиторий.
Если вы не знаете URL-адрес репозитория, в Visual Studio можно легко перейти к существующему репозиторию GitHub или Azure DevOps и выбрать его.
Открытие существующего локального репозитория
После клонирования или создания репозитория GIT Visual Studio обнаружит его и добавит в список Локальные репозитории в меню GIT. В нем можно быстро открывать репозитории GIT и переключаться между ними.
Просмотр файлов в обозревателе решений
При клонировании репозитория или открытии локального репозитория Visual Studio переключается в этот контекст GIT, сохраняя и закрывая все ранее открытые решения и проекты. Обозреватель решений загружает папку в корне репозитория GIT и проверяет дерево каталогов на наличие файлов представлений. К ним относятся такие файлы, как CMakeLists.txt или файлы с расширением SLN.
Visual Studio настраивает представление в зависимости от файла представления, загруженного в обозревателе решений.
- При клонировании репозитория, содержащего один SLN-файл, обозреватель решений напрямую загружает это решение.
- Если обозреватель решений не обнаруживает файлов SLN в репозитории, по умолчанию он загружает представление папки.
- Если репозиторий содержит несколько файлов SLN, то обозреватель решений выводит список доступных представлений для выбора.
Переключаться между текущим представлением и списком представлений можно с помощью кнопки Переключить представления на панели инструментов обозревателя решений.
Окно «Изменения GIT»
GIT отслеживает изменения файлов в репозитории в процессе работы и разделяет файлы на три категории. Это те же изменения, которые отображаются при вводе команды git status в командной строке.
- Файлы без изменений: эти файлы не были изменены с момента последней фиксации.
- Измененные файлы: эти файлы изменились с момента последней фиксации, но еще не были подготовлены для следующей фиксации.
- Промежуточные файлы: эти файлы содержат изменения, которые будут добавлены в следующую фиксацию.
В процессе работы Visual Studio отслеживает изменения в файлах проекта в разделе Изменения окна Изменения GIT.
Когда вы будете готовы подготовить изменения, нажмите кнопку + (плюс) для каждого из файлов, которые необходимо подготовить, или щелкните файл правой кнопкой мыши и выберите пункт Промежуточно сохранить. Можно также подготовить все измененные файлы одним щелчком мыши, используя кнопку «Промежуточно сохранить все» ( + ) в верхней части раздела Изменения.
При подготовке изменения Visual Studio создает раздел Подготовленные изменения. Только изменения из раздела Подготовленные изменения добавляются к следующей фиксации, которую можно выполнить, выбрав команду Зафиксировать промежуточные. Эквивалентная команда для этого действия — git commit -m «Your commit message» . Можно также отменить подготовку изменений, нажав кнопку – (минус). Эквивалентная команда для этого действия — git reset для отмены размещения одного файла или git reset для отмены размещения всех файлов в каталоге.
Кроме того, можно отказаться от подготовки измененных файлов, пропустив область подготовки. В этом случае Visual Studio позволяет зафиксировать изменения напрямую без предварительной подготовки. Просто введите сообщение о фиксации и выберите Зафиксировать все. Эквивалентная команда для этого действия — git commit -a .
Visual Studio также позволяет выполнить фиксацию и синхронизацию одним щелчком мыши с помощью ярлыков Зафиксировать все и отправить и Зафиксировать все и синхронизировать. Если дважды щелкнуть любой файл в разделе Изменения или Подготовленные изменения, то можно построчно сравнить измененную версию файла с неизмененной.
Если вы подключены к репозиторию Azure DevOps, вы можете связать рабочий элемент Azure DevOps с фиксацией, используя символ #. Чтобы подключить репозиторий Azure DevOps, выберите Team Explorer > Управление подключениями.
Выбор существующей ветви
В Visual Studio текущая ветвь отображается в селекторе в верхней части окна Изменения GIT.
Текущая ветвь также доступна в строке состояния в правом нижнем углу интегрированной среды разработки Visual Studio.
В обоих местах можно переключаться между имеющимися ветвями.
Создание ветви
Можно также создать новую ветвь. Эквивалентная команда для этого действия — git checkout -b
.
Чтобы создать ветвь, достаточно ввести ее имя и указать существующую ветвь, на основе которой будет создана данная.
В качестве базовой можно выбрать существующую локальную или удаленную ветвь. Если флажок Извлечь ветвь установлен, вы автоматически переключитесь на новую ветвь после ее создания. Эквивалентная команда для этого действия — git checkout -b .
Окно «Репозиторий GIT»
В Visual Studio имеется новое окно Репозиторий GIT, в котором представлены все сведения о репозитории, включая все ветви, удаленные репозитории и журналы фиксации. Открыть это окно можно из меню GIT или Вид либо непосредственно из строки состояния.
Управление ветвями
При выборе в меню GIT пункта Управление ветвями отображается древовидное представление ветвей в окне Репозиторий GIT. В левой области можно использовать контекстное меню для извлечения, создания, объединения ветвей, перемещения изменений из одной ветви в другую, отбора изменений и других действий. Щелкнув ветвь, можно просмотреть ее журнал фиксаций в правой области.
Входящие и исходящие фиксации
При принесении ветви в окне Изменения GIT под раскрывающемся списком ветвей отображается индикатор, который показывает количество фиксаций, которые не были вытянуты из удаленной ветви. Он также показывает число локальных фиксаций, которые не были отправлены.
Индикатор также является ссылкой, по которой можно перейти к журналу фиксаций этой ветви в окне Репозиторий GIT. В начале журнала теперь отображаются сведения об этих входящих и исходящих фиксациях. Здесь можно также вытянуть или отправить фиксации.
Сведения о фиксации
Если дважды щелкнуть фиксацию, в Visual Studio откроются сведения о ней в отдельном окне инструментов. Здесь можно отменить фиксацию, сбросить ее, исправить сообщение о фиксации или создать тег для нее. Если щелкнуть измененный файл в фиксации, в Visual Studio откроется инструмент сравнения, в котором рядом друг с другом показаны фиксация и ее предок.
Разрешение конфликтов слияния
Во время слияния могут возникать конфликты, если два разработчика изменяют одни и те же строки в файле и GIT неизвестно, какой вариант правильный. В этом случае GIT прерывает слияние и сообщает о конфликтном состоянии.
В Visual Studio можно легко выявлять и устранять конфликты слияния. Во-первых, в верхней части окна Репозиторий GIT имеется золотистая информационная панель.
В окне Изменения GIT также выводится сообщение Слияние выполняется с конфликтами, под которым в отдельном разделе указываются файлы, слияние которых не было выполнено.
Но если ни одно из этих окон не открыто и вы переходите к файлу с конфликтами слияния, вам не придется искать следующий текст:
Вместо этого в верхней части страницы в Visual Studio отображается золотистая информационная панель с сообщением о наличии конфликтов в открытом файле. Щелкните ссылку, чтобы открыть редактор слияния.
Редактор слияния
Редактор слияния в Visual Studio позволяет выполнять трехстороннее сравнение: в нем приводятся входящие изменения, текущие изменения и результат слияния. С помощью панели инструментов вверху редактора слияния можно переходить между конфликтами и просматривать результаты автоматического слияния в файле.
Можно также использовать переключатели для отображения и скрытия различий, отображения и скрытия различий в словах и настройки макета. Вверху с каждой стороны есть флажки, с помощью которых можно перенести все изменения с одной стороны на другую. Чтобы перенести отдельные изменения, можно установить флажки слева от конфликтующих строк с любой стороны. Завершив разрешение конфликтов, нажмите в редакторе слияния кнопку Принять слияние. После этого нужно ввести сообщение о фиксации и зафиксировать изменения, чтобы завершить процесс разрешения.
Настройка параметров GIT
Чтобы настроить параметры GIT на уровне репозитория, а также на глобальном уровне, выберите в строке меню пункты GIT > Параметры или Сервис > Параметры > Управление исходным кодом. Затем выберите нужные параметры.
Использование всех возможностей Team Explorer в Visual Studio
Новый интерфейс GIT — это система контроля версий по умолчанию в Visual Studio 2019 начиная с версии 16.8. Однако при желании этот интерфейс можно отключить. Чтобы вернуться в Team Explorer для Git, выберите Средства > Параметры > Среда > Функции предварительной версии и снимите флажок Новый пользовательский интерфейс Git.
Что дальше?
Хотя новый интерфейс GIT теперь включен по умолчанию в Visual Studio 2019 версии 16.8, мы продолжаем добавлять новые функции для его совершенствования. Чтобы ознакомиться с новыми обновлениями для интерфейса GIT в предварительной версии, скачайте и установите ее со страницы Visual Studio Preview.
Если у вас есть предложение, отправьте его нам. Мы будем рады вашему участию в работе над решением на портале Сообщества разработчиков.
Источник