Správa úložišť GitHub pro vývoj v JavaScriptu v editoru Visual Studio Code

Visual Studio Code poskytuje komplexní integraci Gitu a GitHubu pro vývojáře v JavaScriptu. Tato příručka vás naučí, jak spravovat úložiště GitHub přímo z vašeho vývojového prostředí, čímž zjednoduší pracovní tok od vytvoření kódu až po nasazení.

Naučíte se otevírat existující úložiště, inicializovat nové projekty, vytvářet větve funkcí, potvrdit změny a odesílat je do GitHubu – to vše bez opuštění VS Code. Tato příručka popisuje více přístupů pro jednotlivé úlohy, včetně panelu aktivit, palety příkazů, stavového řádku a integrovaného terminálu, abyste mohli zvolit metody, které nejlépe vyhovují vašemu stylu vývoje.

Požadavky

• Git nainstalovaný na místním počítači
• Visual Studio Kód nainstalován
• Účet GitHubu

Otevření vzdáleného úložiště

Otevřete vzdálené úložiště na místním počítači.

Panel aktivit

1. Instalace rozšíření vzdáleného úložiště
2. Vyberte vzdálený indikátor v levém dolním rohu editoru Visual Studio Code.
3. Postupujte podle pokynů.

Stavový řádek

Tato akce není k dispozici v rámci této funkce. Vyberte jinou kartu.

Paleta příkazů

1. Otevřete paletu příkazů pomocí kombinace kláves Ctrl + +
2. Na příkazovém řádku palety zadejte gitcl, vyberte příkaz Git: Clone , pak vyberte Clone z GitHubu a stiskněte Enter.
3. Po zobrazení výzvy k zadání adresy URL úložiště vyberte klon z GitHubu a stiskněte Enter.
4. Pokud se zobrazí výzva k přihlášení k GitHubu, dokončete proces přihlášení.
5. Do pole Adresa URL úložiště zadejte azure-samples/js-e2e-express-server.
6. Vyberte (nebo vytvořte) místní adresář, do kterého chcete projekt naklonovat, a pak vyberte Vybrat jako cíl úložiště.
7. Když se zobrazí oznámení s dotazem, jestli chcete otevřít klonované úložiště, vyberte Otevřít.

Integrovaný terminál

1. Otevřete integrovaný terminál z terminálu –> Nový terminál.

2. Naklonujte úložiště pomocí následujícího příkazu Git:

   git clone https://github.com/<ACCOUNT>/<REPOSITORY>
   

3. Otevřete v editoru Visual Studio Code:

   code <REPOSITORY>
   

Visual Studio Code používá ověřování Git poskytované operačním systémem (například správce klíčů macOS nebo Správce přihlašovacích údajů systému Windows) s libovolnou funkcí Gitu. Výstup je viditelný v paletě příkazů > Git: Zobrazit výstup.

Připojení k vlastním doménám GitHubu

Visual Studio Code ve výchozím nastavení předpokládá, že vaše úložiště jsou hostovaná v github.com. Pokud se potřebujete připojit k úložišti v jiné doméně (například podnikový GitHub, jako je github.<company_name>.com), budete muset odpovídajícím způsobem nakonfigurovat cestu Gitu.

Pokud chcete aktualizovat cestu Gitu ve VS Code, otevřete Soubor → Předvolby → Nastavení a vyhledejte Git: Path. Toto nastavení umožňuje zadat absolutní cestu ke spustitelnému souboru Gitu, který funguje s vlastní doménou GitHubu.

Alternativně můžete přidat nebo aktualizovat nastavení git.path přímo do souboru settings.json, abyste zajistili, že VS Code pro všechny operace úložiště používá správný binární soubor Gitu.

Otevření místního úložiště

Pokud máte na místním počítači existující úložiště a chcete ho otevřít v editoru Visual Studio Code, stačí otevřít složku. Visual Studio Code rozpozná .git podsložku a zobrazí příslušné informace.

Panel aktivit

1. Vyberte Ctrl + K + O.
2. Vyberte složku.

Stavový řádek

Tato akce není k dispozici v rámci této funkce. Vyberte jinou kartu.

Paleta příkazů

1. Otevřete paletu příkazů pomocí kombinace kláves Ctrl + +
2. Vyfiltrujte Git, pak vyberte Open repository.
3. Vyberte složku, která se má vybrat jako kořen úložiště.

Integrovaný terminál

1. Otevřete integrovaný terminál z terminálu –> Nový terminál.

2. Otevřete novou instanci editoru Visual Studio Code pro adresář úložiště:

   code ../dir1/dir2/my-repo
   

Inicializace nového úložiště

Pomocí následujícího postupu vytvořte místní úložiště zdrojového kódu s git.

Panel aktivit

1. Na panelu aktivit vyberte správu zdrojového kódu nebo použijte kombinaci kláves Ctrl + +

2. Vyberte Inicializovat úložiště.

   

Stavový řádek

Tato akce není k dispozici v rámci této funkce. Vyberte jinou kartu.

Paleta příkazů

1. Otevřete paletu příkazů pomocí kombinace kláves Ctrl + +
2. Vyfiltrujte Git, pak vyberte Initialize repository.
3. Vyberte složku, která se má vybrat jako kořen úložiště.

Integrovaný terminál

1. Otevřete integrovaný terminál z terminálu –> Nový terminál.

2. Inicializace složky pomocí gitu pomocí následujícího příkazu Git:

   git init
   

Po inicializaci úložiště vytvořte úložiště na GitHubu. Pak přidejte toto úložiště jako vzdálené do místního projektu z palety příkazů: vyhledejte Git: Add remote.

Vytvoření větve pro změny

Vytvořte novou větev, která bude zachytávat změny a izolovat od hlavní nebo výchozí větve.

Panel aktivit

1. Na panelu aktivit vyberte správu zdrojového kódu.
2. Vyberte tři tečky (...) vedle Správa verzí.
3. Vyberte Větev ->Create Branch.

Stavový řádek

1. Na stavovém řádku vyberte název větve. Tím se otevře paleta příkazů.

   Stavový řádek se nachází v dolní části editoru Visual Studio Code.

2. Na paletě příkazů vyberte +Vytvořit novou větev.

3. Zadejte název nové větve.

4. Zadejte název nové větve. Název větve se zobrazí na stavovém řádku.

   

Paleta příkazů

1. Otevřete paletu příkazů pomocí kombinace kláves Ctrl + +

2. Vyhledejte git branch a vyberte Git: Create Branch.

   

3. Zadejte název nové větve, například test.

4. Název větve se zobrazí na stavovém řádku.

   

Integrovaný terminál

1. Otevřete integrovaný terminál z terminálu –> Nový terminál.

2. Vytvořte novou větev s názvem MY-BRANCH pomocí následujícího příkazu Git:

   git checkout -b MY-BRANCH
   

Změny potvrdit lokálně

Jakmile provedete změny souborů ve větvi, potvrďte změny.

Panel aktivit

1. Na panelu aktivit vyberte správu zdrojového kódu.

2. Zadejte zprávu potvrzení a pak vyberte Potvrdit.

   

Stavový řádek

Tato akce není k dispozici v rámci této funkce. Vyberte jinou kartu.

Paleta příkazů

1. Otevřete paletu příkazů pomocí kombinace kláves Ctrl + +
2. V příkazové paletě filtrujte pomocí Git, poté vyberte Commit.
3. Zadejte zprávu potvrzení a stiskněte Enter.

Integrovaný terminál

1. Otevřete integrovaný terminál z terminálu –> Nový terminál.

2. Vytvořte novou větev s názvem MY-BRANCH pomocí následujícího příkazu Git:

   git commit -m "YOUR COMMIT MESSAGE"
   

Odeslat místní větev na GitHub

Panel aktivit

1. V panelu aktivit vyberte ikonu Řízení zdrojů.
2. Vyberte Publikovat pobočku. Pokud úložiště na GitHubu neexistuje, vytvoří úložiště za vás.

Stavový řádek

1. Na stavovém řádku editoru Visual Studio Code vyberte ikonu pro odeslání napravo od názvu větve.

   

2. Vyberte vzdálený název z vyskakovacího okna. Pokud máte jen jeden ovladač, nebudete vyzváni k výběru názvu ovladače.

Paleta příkazů

1. Otevřete paletu příkazů pomocí kombinace kláves Ctrl + +
2. V příkazové paletě filtrujte pomocí Git, poté vyberte Push.
3. Pokud máte více vzdálených upstreamů, vyberte název upstreamu a stiskněte Enter.

Integrovaný terminál

1. Otevřete integrovaný terminál z terminálu –> Nový terminál.

2. Vytvořte novou větev s názvem MY-BRANCH pomocí následujícího příkazu Git:

   git push <remote-name> <branch-name>
   

Zobrazení výstupu Gitu

Výstup příkazů Gitu můžete zobrazit při použití rozšíření Správy zdrojového kódu. Tento výstup pomáhá ladit, když příkaz selže.

1. V panelu aktivit vyberte ikonu Řízení zdrojů.

2. Vyberte tři tečky (...), a poté vyberte Zobrazit Git výstup.

   

Nástroje editoru Visual Studio Code pro práci s Gitem a GitHubem

Práce v editoru Visual Studio Code s úložištěm používá samostatné nástroje.

Ikona	Informace	Přístup z
	Git příkazy na paletě příkazů	F1
	Rozšíření správy zdrojového kódu	Panel aktivit
	Rozšíření GitHub Pull Requests a Issues	Panel aktivit
	Rozšíření GitHub repozitářů	Úložiště GitHub můžete rychle a snadno otevřít tak, že vyhledáte úložiště GitHub: Open Repository... z palety příkazů, F1 nebo výběrem možnosti Otevřít úložiště GitHub... ze vzdáleného indikátoru (zelené tlačítko v levém dolním rohu stavového řádku).

Související prostředky

• Nasazení webové aplikace
• Práce s GitHubem v editoru Visual Studio Code
• Použití editoru Visual Studio Code s jinými poskytovateli správy verzí