Pracovní prostředí Visual Studio Code, často označované jako Workspace, představuje souhrn souborů, které jsou současně otevřené v jednom okně. Může se jednat o jedinou složku, ale běžně zahrnuje i více souborů v rámci komplexnějších vývojových postupů, takzvaných multi-root workspaces. Pokud pracujete na projektu, který vyžaduje manipulaci s větším počtem souborů, nová funkce Workspace vám usnadní práci. Umožní vám mít všechny potřebné dokumenty přístupné v jednom okně. Konfigurace projektu je uložena v souboru .code-workspace. Po nakonfigurování se různé soubory automaticky otevírají ve stejném okně. Nastavení je také jednodušší a rychlejší, než psaní skriptů. Pojďme se podívat na to, jak vytvořit takové pracovní prostředí ve VS Code.
Založení nového pracovního prostoru ve VS Code
Většinou je pracovní prostor lokální kopií týmové kódové základny, kde testujete a vyvíjíte svůj kód. V mnoha případech vzniká automaticky při otevření složky ve VS Code. Nicméně, můžete potřebovat pracovat s několika soubory, abyste měli kontrolu nad všemi změnami v různých větvích projektu. Zde je návod, jak takové soubory spojit do jednoho pracovního prostředí VS Code Workspace.
- Nejprve vyberte složky, které chcete zahrnout do svého pracovního prostoru.
- Následně je přidejte do pracovního prostoru pomocí „Soubor“ a „Přidat složku do pracovního prostoru“.
- Po dokončení nastavení pracoviště uložte nový pracovní prostor volbou „Soubor“ a poté „Uložit pracovní prostor jako“.
Váš nový pracovní prostor je nyní vytvořen a pojmenován jako (Název).code-Workspace.
Konfigurace pracovního prostoru
Tato nastavení mají přednost před výchozími a lze je použít k úpravě pracovního prostoru dle vašich preferencí. Jsou uložena v JSON souborech, jejichž umístění je dáno způsobem, jakým složku otevíráte.
Nastavení pro pracovní prostor s jedinou složkou
Pokud otevíráte složku přímo jako pracovní prostor, nastavení naleznete v souboru .vscode/settings.json.
Nastavení pro vícesložkový pracovní prostor
V případě, že otevíráte soubor .code-workspace, jsou všechna nastavení pracovního prostoru uložena přímo v tomto souboru.
Stále máte možnost konfigurovat nastavení pro kořenovou složku, avšak nastavení definovaná v .code-workspace mají vyšší prioritu.
Konfigurace úkolů a spouštění pracovního prostoru
Stejně jako nastavení, i úkoly a spouštění lze přizpůsobit pro konkrétní pracovní prostor. Pokud máte otevřený soubor .code-workspace nebo Workspace, konfigurace úkolů a spouštění jsou uloženy v souboru .vsh nebo .workspace. Tyto konfigurace je možné editovat i ze složky.
Optimalizace nového VS Code pracovního prostoru
Díky integrované podpoře různých programovacích jazyků, jako jsou TypeScript, JavaScript a Node.js, je Workspace ideálním nástrojem pro vývojáře. Následující tipy vám pomohou zefektivnit a zjednodušit používání této platformy.
Terminály
Místo použití terminálu vašeho operačního systému nabízí VS Code vlastní, integrovaný terminál. Ten vám umožňuje mít vše potřebné na jednom místě a sledovat průběh vašich vývojových projektů. S možností přejmenování nebo změny barvy ikon je také snazší rozlišovat mezi různými terminály pro jednotlivé projekty.
Zalamování záložek
Tato funkce je zvláště užitečná pro vývojáře, kteří pracují na rozsáhlých projektech s mnoha komponentami. Sledování všech otevřených souborů může být obtížné. Ve VS Code se záložky zobrazují v prohlížeči a je nutné přepínat mezi nimi. Efektivnějším řešením je zalamování záložek pomocí klávesové zkratky Cmd + a vyhledáním „Wrap Tabs“. Tato funkce usnadní přehled nad otevřenými soubory.
Připínání záložek
Jako vývojáři je užitečné udržovat pracovní prostor maximálně organizovaný. Proto si můžete připnout karty, které často používáte, do popředí obrazovky. Vzhled a chování těchto karet je možné přizpůsobit pomocí Cmd + nebo Ctrl + a vyhledáním „Pin Tab“.
Uživatelské rozhraní
Rozhraní terminálu obsahuje různé sekce, jako jsou průzkumník, vyhledávání, projektový manažer a výstup. Dále má sekci v dolní části, kde můžete snadno upravit detaily. Ve VS Code lze tyto sekce přetahovat a přeskupovat podle vašich potřeb, což usnadňuje navigaci v pracovním prostoru. Častěji používané možnosti si můžete umístit blíže k horní části, nebo je upravit pro snazší přístup.
Jazyk
Při vytváření nového souboru v kódu Visual Studio není soubor automaticky pojmenován a tyto detaily je nutné vyplnit ručně. Dále musíte zadat i příponu souboru. Tento proces může být vyčerpávající, zejména při práci s velkým množstvím souborů. Proces můžete optimalizovat tím, že IDE umožníte analyzovat existující soubory. Poté bude používat předchozí systém pojmenování i pro nové soubory.
Náhled
VS Code má i některé méně uživatelsky přívětivé funkce. Například, pokud otevřete soubor v náhledu a ihned otevřete další bez úprav v prvním, program první soubor zavře. Pokud chcete toto chování změnit a mít oba soubory otevřené, přejděte do Nastavení a vyhledejte „Povolit náhled“. Zaškrtnutím políčka provedete potřebné změny.
Nové nastavení PC
Možná jste si svůj VS Code Workspace již plně přizpůsobili k obrazu svému, ale co když si pořídíte nový počítač? Nutnost opětovného nastavování může být nepříjemná. Nastavení synchronizace vám umožní uložit všechny vaše konfigurace na jedno místo. Po pořízení nového zařízení se automaticky použijí nastavení starého VS Code. Díky tomu nemusíte Workspace konfigurovat znovu.
OpenReplay
Ladění webové aplikace v produkčním prostředí může být časově náročné. S OpenReplay můžete sledovat a přehrávat veškeré kroky uživatelů, což vám umožní vidět chování aplikace a detekovat případné problémy. OpenReplay je bezplatná alternativa s otevřeným zdrojovým kódem k jiným ladícím aplikacím, jako jsou LogRocket a FullStory. Používání ladícího programu vám ušetří mnoho času při práci s Workspace.
GitHub
VS Code nabízí integrovanou podporu pro GitHub. To vám umožní snadno odesílat soubory na GitHub. Propojení s GitHubem z VS Code vám ušetří čas strávený psaním git příkazů a usnadní údržbu vašich souborů.
Všechny vaše složky na jednom místě
Workspace usnadňuje organizaci práce celému týmu. Soubory a složky jsou uloženy na jednom místě a je možné je otevřít a zobrazit kliknutím na tlačítko. Pracovní prostor lze také optimalizovat pro zvýšení efektivity a sledování probíhajících projektů. S tímto průvodcem jste nyní dobře vybaveni pro vytvoření a přizpůsobení pracovního prostoru ve VS Code tak, aby vyhovoval vašim potřebám.
Už jste si vytvořili nový pracovní prostor ve VS Code? Podělte se o své zkušenosti a tipy v komentářích níže.