Работаем с git-ветками в WebStorm

11.1 Ветки в гите

Работа с ветками branches в Git — это один из ключевых аспектов управления версиями, который позволяет параллельно вести несколько линий разработки в одном репозитории. Ветвление делает Git мощным инструментом для коллаборации, экспериментов и управления различными версиями проекта.

Вы можете думать о ветках в git как о папках, куда git копирует ваш проект. У вас есть основная папка вашего проекта в вашем локальном репозитории — main, и git может создать копии этой папки, чтобы вы в них попробовали с чем-то поэкспериментировать и не сломали основной, хорошо работающий код. Такие папки-копии называют ветками — branches.

Ветки — это альтернативные варианты кода. Допустим, вы хотите что-то переделать в большом проекте, провести эксперимент, в котором вы не до конца уверены. Как бы вы сделали это без git?

Можно было бы скопировать проект в новую папку и попробовать все в ней поменять. Если результат вам понравится, то можно скопировать его в основную папку. Если не понравится — забыть о ней, ну или вообще удалить.

Или давайте возьмем пример из жизни. Скажем, написание книги:

1. У вас есть рукопись книги (основная ветка).
2. Вы хотите попробовать изменить концовку (создание новой ветки).
3. Вы пишете новую концовку в отдельном документе (работа в новой ветке).
4. Если новая концовка лучше, вы заменяете старую в рукописи (слияние веток).
5. Удаляете отдельный документ с новой концовкой (удаление ветки).

11.2 Создание веток

Создать ветку в WebStorm очень просто:

Введите имя ветки:

WebStorm сразу же отобразит имя вашей текущей ветки сверху в меню:

А до этого там что было?

Там было название вашей первой и основной ветки — main.

Теперь там отображается test, а значит Git (под руководством WebStorm) не только создал новую ветку, но и сразу переключился на нее.

Давайте в файл main.html в текущей ветке test добавим какой-нибудь код и закоммитим его:

11.3 Переключение между ветками

Шаг 1. Выбираем ветку.

Теперь давайте переключимся на нашу старую ветку. Кликнем по верхнему меню, и что мы там видим?

Не пугайтесь — тут все просто:

Local — это список веток вашего локального git-репозитория. Тут их две:

• test
• main

Remote — это ваш удаленный репозиторий, который находится на сервере GitHub. Мы туда пушили ваши изменения, но новой ветки там нет, что логично. Удаленный репозиторий носит имя origin, и в нем есть только ветка main.

Recent — это просто список имен последних веток, с которыми вы работали: этот пункт WebStorm добавляет для удобства и скорости.

Название origin/main справа от имени локального репозитория — это имя удаленного репозитория, с которым он сейчас синхронизирован, и куда будут пушиться изменения.

Шаг 2. Выгружаем код ветки в текущую папку.

Шаг 3. Проверяем.

У меня отображается ветка main и старый код:

11.4 Слияние веток

Давайте теперь попробуем объединить код из наших двух веток.

Шаг 1. Для начала давайте добавим в наш проект еще один файл — index.html и напишем в нем какой-то код:

• Создаем файл index.html
• Пишем в нем код <h1>Hello</h1>
• Коммитим файл

Вот как выглядят два моих файла в ветке main:

Шаг 2. Слияние веток.

Вольем в нашу текущую ветку main изменения, которые были сделаны в ветке test.

Для этого тоже воспользуемся верхним меню и командой Merge ‘test’ into ‘main’:

Шаг 3. Проверяем результат.

Проверяем:

• Сверху по-прежнему отображается ветка main
• Файлов у нас 2: index.html и main.html
• Файл main.html содержит код, который был добавлен в ветке test

11.5 Конфликты при слиянии

Иногда при слиянии веток бывают конфликты.

Если вы внесете изменения в один файл в разных ветках и попробуете их объединить, то может возникнуть конфликт.

Конфликт текстовых файлов

Git — это очень умная система — она понимает типы файлов. Если вы внесете изменения в разные места файлов, которые она считает текстовыми, она просто перенесет изменения из одного файла в другой в нужное место (так, как бы это сделал человек).

Конфликт бинарных файлов

Но если вы поправите где-то картинку или документ, Git не будет пытаться объединить их части в один: он просто предложит вам выбрать, какую версию файла вы хотите оставить в текущей ветке.

Ручное разрешение конфликтов

Если вы внесете изменения в одно и то же место текстового файла, то Git не сможет правильно объединить разны версии и предложит это сделать вам:

Вот как это может выглядеть:

Что вы тут видите:

• Слева — содержимое файла main.html ветки main
• Справа — содержимое файла main.html ветки test
• В середине WebStorm предлагает вам написать финальную версию кода (можно кликнуть по кнопкам >> и <<, чтобы автоматически вставить изменения из какого-то файла)

Я принял вариант mater и дописал код ручками. Вот что у меня получилось:

11.6 История изменений

Еще из полезного и интересного. Вы можете посмотреть историю изменений любого файла, кликнув по кнопке Show History. Есть два места, где она может находиться. Найдите ее.

Вот как выглядит история изменений у меня для файла main.html:

Пояснения:

• Слева вы видите историю изменений конкретного файла:
  • Чем изменение новее, тем оно выше, чем старее – тем ниже
  • Также тут отображается история слияния веток
• Справа — изменения который были внесены в конкретном коммите

1

Опрос

Декоративные элементы, 10 уровень, 12 лекция

Недоступен

Декоративные элементы

Декоративные элементы

Открыть