Übernehmen Sie den ausgewählten Teil, nicht die gesamte Datei

• Wählen Sie den Datei-, Hunk- oder Zeilenbereich für einen bestimmten Commit.
• Wählen Sie beide entfernten/hinzugefügten Zeilen als Ersatz aus.
• Index und Arbeitsinhalte selbstständig lesen.
• Behalten Sie die nicht festgeschriebene Radiusbearbeitung für Lektion 8 bei.

Sie beginnen dort, wo Lektion 6 aufgehört hat: Das ursprüngliche Hauptprogramm verfügt über zwei Commits, die ausführbare Lektion 6 über Eingaben und kein Remote-Modul. Funktioniert/Index sauber; ignorierter Abstand kann vorhanden sein. Das Video wurde mit Git 2.52.0 und GitTree 2.0 auf Ubuntu 24.04 aufgenommen: Beide Bearbeitungen wurden im eigenen Editor von GitTree gespeichert, der Block und die Zeilen wurden bereitgestellt und der Commit wurde in der App durchgeführt, und die Terminalprüfungen wurden anhand der von der App erstellten Inhalte oder anhand separater Kopien durchgeführt. Die Hunk- und Line-Kontrollen wurden real bedient; Die native Patch-Route lief in einer separaten Kopie. Auf macOS oder Windows wurde nichts ausgeführt, und Ubuntu ist das einzige aufgezeichnete Linux-System. Die Quell-Git-Mindestversion von GitTree ist 2.39.0. Sobald Sie angemeldet sind, ist die Arbeit vor Ort im kostenlosen Plan enthalten.

Eine Datei kann mehrere unabhängige Entscheidungen enthalten. Ein Kerl gruppiert nahegelegene Textänderungen, nicht unbedingt eine Geschäftsabsicht. Für die Auswahl eines Ersatzes ist die entfernte alte Zeile and die hinzugefügte neue Zeile erforderlich. Wenn Sie nur den Zusatz auswählen, kann ein anderer Patch erstellt werden.

Der Index beschreibt einen vollständigen nächsten Baum, auch wenn Sie nur wenige geänderte Zeilen auswählen. Hier hat HEAD CSS-01, der Index wird zu CSS-02-INDEX und funktionierendes CSS bleibt CSS-02-WORKING. Das Speichern von Änderungen ändert die Arbeitsbytes; Stage Lines ändert den Index; Der normale Commit verschiebt main, überschreibt jedoch nicht den verbleibenden Radius. Keine Änderung der Remote-Referenzen. Native Partial Staging und Patch-Anwendung verwenden dieselben Inhaltsunterschiede.

Ersetzen Sie index.html durch HTML-02-HEADLINE und Working Styles.css durch CSS-02-WORKING. CSS-02-INDEX unten ist target index, kein Text zum Überschreiben der Arbeitsdatei.

index.html – HTML-02-HEADLINE

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>GitTree Features — course demo</title>
  <link rel="stylesheet" href="styles.css">
</head>
<body>
  <header class="site-header">
    <a href="#main">GitTree Features</a>
  </header>
  <main id="main">
    <section class="hero" aria-labelledby="hero-title">
      <p class="eyebrow">GitTree Learn demo project</p>
      <h1 id="hero-title">See your work clearly.</h1>
      <p id="hero-copy">Choose one change, then check what Git saved.</p>
    </section>
    <section class="features" aria-labelledby="features-title">
      <h2 id="features-title">Follow your work</h2>
      <div class="cards">
        <article class="feature-card">
          <h3>History</h3>
          <p>Read commits and branches together.</p>
        </article>
        <article class="feature-card">
          <h3>Changes</h3>
          <p>Review the exact content selected for a commit.</p>
        </article>
        <article class="feature-card">
          <h3>Recovery</h3>
          <p>Inspect the scope of a recovery point before using it.</p>
        </article>
      </div>
    </section>
  </main>
  <footer><p>Built by a fictional team for GitTree Learn.</p></footer>
  <script type="module" src="site.js"></script>
</body>
</html>

style.css – CSS-02-INDEX

:root {
  color-scheme: light;
  --page: #f7f8fa;
  --surface: #ffffff;
  --text: #17212e;
  --link: #154ab5;
  --line: #bac4d0;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  background: var(--page);
  color: var(--text);
  font: 1rem/1.6 system-ui, sans-serif;
}

a {
  color: var(--link);
}

.site-header,
main,
footer {
  width: min(68rem, 100% - 2rem);
  margin-inline: auto;
}

.site-header {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 1rem;
  padding-block: 1rem;
}

.hero {
  max-width: 48rem;
  padding-block: 3rem;
}

h1 {
  font-size: clamp(2rem, 5vw, 3.5rem);
  line-height: 1.2;
}

.cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(16rem, 100%), 1fr));
  gap: 1rem;
}

.feature-card {
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: 0.5rem;
  background: var(--surface);
}

section {
  margin-block-end: 2rem;
}

button,
input {
  font: inherit;
}

button,
input {
  padding: 0.5rem 0.75rem;
}

:focus-visible {
  outline: 3px solid var(--link);
  outline-offset: 3px;
}

form {
  display: grid;
  max-width: 28rem;
  gap: 0.5rem;
}

styles.css – CSS-02-WORKING

:root {
  color-scheme: light;
  --page: #f7f8fa;
  --surface: #ffffff;
  --text: #17212e;
  --link: #154ab5;
  --line: #bac4d0;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  background: var(--page);
  color: var(--text);
  font: 1rem/1.6 system-ui, sans-serif;
}

a {
  color: var(--link);
}

.site-header,
main,
footer {
  width: min(68rem, 100% - 2rem);
  margin-inline: auto;
}

.site-header {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 1rem;
  padding-block: 1rem;
}

.hero {
  max-width: 48rem;
  padding-block: 3rem;
}

h1 {
  font-size: clamp(2rem, 5vw, 3.5rem);
  line-height: 1.2;
}

.cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(16rem, 100%), 1fr));
  gap: 1rem;
}

.feature-card {
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: 0.75rem;
  background: var(--surface);
}

section {
  margin-block-end: 2rem;
}

button,
input {
  font: inherit;
}

button,
input {
  padding: 0.5rem 0.75rem;
}

:focus-visible {
  outline: 3px solid var(--link);
  outline-offset: 3px;
}

form {
  display: grid;
  max-width: 28rem;
  gap: 0.5rem;
}

1. Fokussieren Sie in Show Files (Befehl/Strg+Umschalt+E) jede vorhandene Datei und drücken Sie die Eingabetaste; Fügen Sie den angegebenen Arbeitskörper ein, dann Save oder Befehl/Strg+S. Fügen Sie das Indexziel nicht über funktionierendes CSS ein.
2. Back to Graph → Befehlspalette… (Befehl/Strg+Umschalt+P) → Show Working Changes. Klicken Sie unter Unstaged Files auf index.html.
3. Wählen Sie Hunk in der Diff-Ansicht (Palette Show Diff as Hunks). Wählen Sie beim Ersetzen der Überschrift Stage Hunk. Erwarten Sie in den bereitgestellten Dateien nur die vollständige Änderung der Überschrift. Ganze Datei Stage File wäre nur deshalb gleichwertig, weil dieser HTML-Code keine andere Bearbeitung hat.
4. Klicken Sie unter „Nicht bereitgestellte Dateien“ auf „styles.css“. Halten Sie Ignore whitespace ausgeschaltet. Suchen Sie den Ersatz für die maximale Breite in Zeile 41: 44rem → 48rem.
5. Aktivieren Sie das Kontrollkästchen für die entfernte max-width: 44rem;-Zeile und die hinzugefügte max-width: 48rem;-Zeile. Zu ihren zugänglichen Namen gehören Zeichen, Zeilennummer und Text. Aktivieren Sie Stage Lines in der Auswahlsymbolleiste. Wählen Sie nicht das Radiuspaar in Zeile 59.
6. Alternative in einer separaten Wiederholung: Stage Hunk auf nur dem Stück mit maximaler Breite ergibt hier das gleiche Ziel. Split/palette Show Diff Side by Side platziert entfernte/hinzugefügte Zellen auf ihren richtigen alten/neuen Seiten; beide verfügen über eigene Auswahlsteuerungen. Kehren Sie für die Hauptaufnahme zu Hunk zurück.
7. Klicken Sie auf „staged styles.css“: Nur die maximale Breite sollte sich ändern. Klicken Sie auf „Unstaged Styles.css“: Es bleibt nur der Radius übrig. Verwenden Sie Clear, um eine Auswahl zu löschen, nicht um Inhalte zu verwerfen. Wenn Sie zu viel bereitgestellt haben, wählen Sie das entsprechende bereitgestellte Stück und Unstage Hunk aus oder wählen Sie beide bereitgestellten Ersatzzeilen und Unstage Lines aus und überprüfen Sie es dann erneut.
8. Geben Sie „Zusammenfassung“ feat: refine the hero and card spacing, alle normalen Optionen aus und Commit Changes to 2 Files ein (oder einmal Befehl/Strg+Eingabetaste). Überprüfen Sie den teilweisen Commit und behalten Sie den nicht bereitgestellten Radius bei.
9. Verwenden Sie nicht Stage All Changes, verwerfen Sie es nicht und führen Sie kein Bereinigungs-Commit durch. Lektion 8 besitzt bewusst den Radius-Commit.

Eine veraltete Auswahl ist an den Diff-Fingerabdruck gebunden. Nach jeder externen Bearbeitung neu laden, anstatt einen Patch für alte Bytes anzuwenden. Wenn das Ausblenden von Leerzeichen die Berechtigung zur Zeilenauswahl aufhebt, lesen Sie den Grund und stellen Sie den vollständigen Unterschied wieder her, anstatt so zu tun, als ob die Auswahl stattgefunden hätte.

Nach dem Speichern beider Änderungen:

git diff -- styles.css

Vollständig beobachteter Arbeitsunterschied:

diff --git a/styles.css b/styles.css
index d443c7e..6382365 100644
--- a/styles.css
+++ b/styles.css
@@ -38,7 +38,7 @@ footer {
 }
 
 .hero {
-  max-width: 44rem;
+  max-width: 48rem;
   padding-block: 3rem;
 }
 
@@ -56,7 +56,7 @@ h1 {
 .feature-card {
   padding: 1rem;
   border: 1px solid var(--line);
-  border-radius: 0.5rem;
+  border-radius: 0.75rem;
   background: var(--surface);
 }
 

Native interaktive Route: git add -p -- index.html wählt seinen Headline-Hunk aus. git add -p -- styles.css kann den ersten Hunk akzeptieren und den Radius-Hunk ablehnen. Die Eingabeaufforderungen variieren je nach Git-Version. Überprüfen Sie den Inhalt, bevor Sie antworten, nicht eine gespeicherte J/N-Sequenz.

Ein deterministisches natives Äquivalent besteht darin, den folgenden vollständigen Patch outside für das Projekt als <selection.patch> zu speichern und ihn nur auf den Index anzuwenden:

diff --git a/styles.css b/styles.css
--- a/styles.css
+++ b/styles.css
@@ -38,7 +38,7 @@
 }
 
 .hero {
-  max-width: 44rem;
+  max-width: 48rem;
   padding-block: 3rem;
 }
 

git add -- index.html
git apply --cached --check "<selection.patch>"
git apply --cached "<selection.patch>"
git diff --cached -- styles.css

Beide Prüfungen/Anwenden erfolgten lautlos im Gerät. Die letzte Abfrage ergab:

diff --git a/styles.css b/styles.css
index d443c7e..4dc8369 100644
--- a/styles.css
+++ b/styles.css
@@ -38,7 +38,7 @@ footer {
 }
 
 .hero {
-  max-width: 44rem;
+  max-width: 48rem;
   padding-block: 3rem;
 }
 

git show :styles.css muss dem vollständigen CSS-02-INDEX oben entsprechen. Die Arbeitsdatei muss immer noch vollständig CSS-02-WORKING entsprechen. Keiner der --cached Patch-Befehle schreibt funktionierendes CSS.

Native Commit-Alternative, keine Wiederholung nach App-Erfolg:

git commit --quiet -m "feat: refine the hero and card spacing"
git status --short
git diff -- styles.css

Stilles Commit: Exit 0, keine Ausgabe. Status:

 M styles.css

Vollständiger verbleibender Arbeitsunterschied:

diff --git a/styles.css b/styles.css
index 4dc8369..6382365 100644
--- a/styles.css
+++ b/styles.css
@@ -56,7 +56,7 @@ h1 {
 .feature-card {
   padding: 1rem;
   border: 1px solid var(--line);
-  border-radius: 0.5rem;
+  border-radius: 0.75rem;
   background: var(--surface);
 }
 

Am Ende dieser Lektion: drei Commits auf main. HEAD/index enthält die neue Überschrift und den breiteren Helden, aber der Radius beträgt dort immer noch 0,5rem; Der Arbeitsradius beträgt 0,75rem. Nur „styles.css“ weist eine nicht bereitgestellte Änderung auf. Kein Remote, Merge oder Rebase. Optionale Notebook-/Clean-Alternativen ersetzen diesen Prüfpunkt nicht.

• Auswahl nur der hinzugefügten Hälfte eines Ersatzes: nicht unbedingt der beabsichtigte Patch.
• Staging der gesamten CSS-Datei: Enthält auch den Radius.
• Einfügen von Zielindex-CSS über funktionierendes CSS: Die absichtlich getrennte Bearbeitung geht verloren.
• Jetzt einen Aufräum-Commit durchführen: Widerspricht der Startaufgabe von Lektion 8.

Verwenden Sie zwischengespeicherte/funktionierende Vergleiche, um eine Indexinkongruenz zu diagnostizieren. Vor dem Festschreiben kann Unstage Lines/Hunk die Auswahl ändern, ohne die Arbeitsbearbeitung zu verwerfen. Wenn Git einen fehlerhaften oder veralteten Patch ablehnt, hören Sie auf; erzwinge es nicht. Lesen Sie die aktuelle Datei erneut und wählen Sie den genauen Inhalt erneut aus. Ein fehlgeschlagener Commit/Hook ist keine Berechtigung zum Überspringen von Hooks.

Beantworten Sie jede Frage und lesen Sie dann, warum. Mit „erforderlich“ gekennzeichnete Fragen zählen zum Abschluss der Lektion.

1. Frage 1 von 6

   Frage 1 von 6

   Was macht einen Adonis aus?

   Wählen Sie eine Antwort.

   Immer ein ganzes Feature

   Eine Filiale

   Nahe gelegener Diff-Kontext

   Antwort prüfen
2. Frage 2 von 6

   Frage 2 von 6

   Welche Zeilen gehören zur Stufe 44rem → 48rem?

   Wählen Sie jede zutreffende Antwort aus.

   44rem entfernt

   Radiuspaar auch

   48rem hinzugefügt

   Antwort prüfen
3. Frage 3 von 6

   Frage 3 von 6Erforderlich

   Wie lauten Breite und Radius im Index nach der Teilauswahl?

   Wählen Sie eine Antwort.

   48rem und 0,5rem

   48rem und 0,75rem

   44rem und 0,75rem

   Antwort prüfen
4. Frage 4 von 6

   Frage 4 von 6Erforderlich

   Was bleibt übrig, wenn Sie vor dem Commit auch den Radius inszenieren?

   Wählen Sie eine Antwort.

   Eine neue Fernbedienung

   Radius ist noch nicht inszeniert

   Kein CSS-Unterschied

   Antwort prüfen
5. Frage 5 von 6

   Frage 5 von 6

   Eine externe Speicherung ändert das ausgewählte Diff. Was ist sicher?

   Wählen Sie eine Antwort.

   Erzwingen Sie den alten Patch

   Verwerfen Sie die gesamte Datei

   Aktuelle Bytes neu laden/neu auswählen

   Antwort prüfen
6. Frage 6 von 6

   Frage 6 von 6Erforderlich

   Überprüfen Sie den fertigen Kontrollpunkt. Welche Beweise stimmen überein?

   Wählen Sie jede zutreffende Antwort aus.

   Drei Commits; KOPF-/Indexbreite 48rem, Radius 0,5rem

   Ein Bereinigungs-Commit hat den Radius bereits gespeichert

   Arbeitsradius 0,75rem; Nur die Datei „styles.css“ wurde geändert

   Antwort prüfen

Erklären Sie die drei verschiedenen Radien-/Breitenzustände anhand der vollständigen Dateien. Geänderte Eingabe: Wenn Sie auch das Radiuspaar bereitstellen, enthält der nächste Commit beide CSS-Änderungen und hinterlässt keinen CSS-Unterschied. Testen Sie das nur in einer separaten Wiederholung; Behalten Sie die Bearbeitung des kanonischen Radius für Lektion 8 bei.

• Wählen Sie den Bereich aus, der der beabsichtigten Änderung entspricht.
• Überprüfen Sie die vollständig vorbereitete Datei und den verbleibenden Arbeitsunterschied.
• Halten Sie unabhängig nützliche Arbeiten getrennt, ohne sie zu zerstören.

• Lesen Sie den Vergleich, bevor Sie eine Änderung beurteilen (Lektion 6)
• Stellen Sie den beabsichtigten Snapshot bereit und führen Sie Ihren ersten Commit durch (Lektion 5)
• Laden Sie GitTree herunter

Hunk – كتلة; ausgewählte Zeilen – الأسطر المختارة; Bühne – تجهيز; unstage – إلغاء التجهيز; Patch – رقعة; Index – الفهرس.