Sdílet prostřednictvím


Použití rozšíření Visual Studio Code pro portály

Visual Studio Code je jednoduchý výkonný editor zdrojového kódu pro Windows, macOS a Linux. Podporuje JavaScript, TypeScript a Node.js a má bohatý ekosystém rozšíření o další jazyky, jako je C ++, C#, Java, Python, PHP a Go, a moduly runtime jako .NET a Unity. Další informace o Visual Studio Code najdete v tématu Začínáme s VS Code.

Visual Studio Code vám umožní rozšířit vaše schopnosti prostřednictvím rozšíření. Rozšíření Visual Studio Code mohou přidat další funkce do celkového prostředí. S vydáním této funkce můžete nyní používat rozšíření Visual Studio Code pro práci s Power Pages.

Rozšíření Visual Studio Code pro Power Pages

Power Platform Tools přidává možnost konfigurovat weby pomocí Visual Studio Code a používat vestavěný jazyk Liquid IntelliSense, což může pomoci s dokončováním kódu, asistencí a nápovědou při přizpůsobení rozhraní webů pomocí Visual Studio Code. Pomocí rozšíření Visual Studio Code můžete také konfigurovat portály prostřednictvím Microsoft Power Platform CLI.

Poznámka:

  • Aby fungovaly funkce Power Pages, musíte si stáhnout a nainstalovat node.js na stejnou pracovní stanici, kde se nachází Visual Studio Code.
  • Ujistěte se, že jsou nainstalovány pouze Power Platform Tools, a nikoli Power Platform Tools i Power Platform Tools [PREVIEW]. Další informace najdete v tématu Známé problémy.

Animace, která vysvětluje, jak nainstalovat a nastavit Power Platform Tools.

Předpoklady

Před použitím rozšíření Visual Studio Code pro Power Pages musíte:

Instalace rozšíření Visual Studio Code

Po instalaci Visual Studio Code musíte nainstalovat rozšíření pro modul plug-in Power Platform Tools pro Visual Studio Code.

Instalace rozšíření Visual Studio Code:

  1. Otevřete Visual Studio Code.

  2. V levém podokně vyberte Rozšíření.

    Rozšíření Visual Studio Code.

  3. V pravém horním rohu podokna rozšíření vyberte ikonu Nastavení.

  4. Vyhledejte a vyberte Power Platform Tools.

    Vyberte Power Platform Tools.

  5. Vyberte volbu Instalovat.

  6. Podle stavových zpráv ověřte, zda bylo rozšíření úspěšně nainstalováno.

Tip

Rozšíření Power Platform Tools automaticky umožňuje použití příkazy Microsoft Power Platform CLI z Visual Studio Code pomocí integrovaného terminálu Visual Studio.

Akce: Power Pages

Akce Power Pages zjednodušují správu webu a snižují závislost na příkazech Microsoft Power Platform CLI. Akce Power Pages jsou k dispozici v podokně s názvem Akce Power Pages na bočním panelu Průzkumníka Visual Studio Code.

V tomto podokně jsou weby kategorizovány takto:

  • Aktivní weby: Weby, které jsou aktuálně dostupné a aktivní ve vybraném prostředí.
  • Neaktivní weby: Weby, které jsou přítomné v prostředí, ale nejsou aktuálně aktivní.
  • Jiné weby: Weby stažené místně, ale ještě nejsou přidružené k vybranému prostředí.

Změna prostředí

Přepnutí prostředí:

  1. Vyberte tlačítko Změnit prostředí v podokně Akce Power Pages.

    Změna prostředí pro weby

  2. V zobrazeném seznamu vyberte požadované prostředí.

Když vyberete prostředí, seznam webů se automaticky aktualizuje.

Akce pro weby

Různé typy webů poskytují kontextově specifické akce, ke kterým se dostanete kliknutím pravým tlačítkem myši.

Akce aktivních webů

Kliknutím pravým tlačítkem na Aktivní weby získáte přístup k následujícím akcím:

  • Náhled: Vymaže mezipaměť a otevře web v rámci VS Code pro okamžitý náhled.
  • Nahrát: Nahraje místní změny zpět do vašeho prostředí.
  • Stáhnout: Stáhne obsah webu do místní složky pro offline úpravy.
  • Údaje o webu: Zobrazí podrobné informace o webu.
  • Zobrazit v Průzkumníku: Přejde do místního adresáře obsahujícího kód webu.
  • Otevřít v Power Pages Studio: Otevře web ve Power Pages studio.
  • Spusťte screening CodeQL: Proveďte statickou analýzu kódu v souborech HTML a JavaScript k identifikaci slabin zabezpečení ve vaší základně kódu pomocí CodeQL. Tato možnost je dostupná jenom pro weby, které se stahují místně, označené aktuální značkou v seznamu aktivních webů.

Akce neaktivních webů

Neaktivní weby poskytují tyto akce:

  • Otevřít správu webu: Otevře web v aplikaci Power Pages Management.
  • Údaje o webu: Poskytuje podrobné informace o vybraném webu, jako je ID webu, adresa URL webu, verze datového modelu a další.

Akce jiných webů

Weby, které jsou uložené místně, ale ještě nejsou ve vašem prostředí, nabízejí následující akce:

  • Nahrát web: Nahraje místní web do připojeného prostředí. Po nahrání se web zobrazí v seznamu Neaktivní weby, kde ho můžete aktivovat z úvodní stránky Power Pages.
  • Zobrazit v Průzkumníku: Přejde do místního adresáře obsahujícího kód webu.

Ikony souboru

Rozšíření Visual Studio Code pro Power Pages automaticky identifikuje a zobrazuje ikony souborů a složek uvnitř staženého obsahu webu.

Seznam souborů v úvodní šabloně s tématem ikony souboru pro konkrétní web.

Visual Studio Code používá výchozí téma ikon souboru, který nezobrazuje ikony specifické pro Power Pages. Chcete-li zobrazit ikony souborů specifické pro vaše weby, musíte aktualizovat instanci Visual Studio Code, aby používala motiv ikon souborů specifických pro Power Pages.

Postup povolení motivu ikon souborů pro konkrétní portál:

  1. Otevřete Visual Studio Code.

  2. Jděte na Soubor>Předvolby>Téma>Téma ikony souboru.

  3. Vyberte téma pro ikony portálů PowerApps.

    Snímek obrazovky znázorňující výběr motivu pro ikony portálů Power Apps.

Náhled webu

Akce náhledu používá rozšíření Microsoft Edge DevTools pro Visual Studio Code k poskytnutí náhledu webu v editoru. Tato funkce spouští nástroje Microsoft EdgeDevTools a vložený prohlížeč Microsoft Edge s emulací zařízení přímo v VS Code, což poskytuje téměř všechny stejné možnosti ladění a kontroly, které najdete v úplných nástrojích Microsoft Edge DevTools.

V náhledu se vždy zobrazují změny, které jste nahráli na svůj web, takže se ujistěte, že jste před otevřením webu odeslali všechny místní úpravy. Pokaždé, když spustíte verzi Preview, mezipaměť webu se automaticky vymaže, abyste měli jistotu, že zobrazíte nejnovější aktualizace.

Náhled otevřete tak, že kliknete pravým tlačítkem myši na aktivní web v části Akce Power Pages a vyberete Náhled. Tato akce otevře vložený prohlížeč Microsoft Edge odkazující na zvolený web.

Screenshot akce náhledu webu Power Pages.

Podokno náhledu se otevře na pravé straně.

Snímek obrazovky znázorňující seznam souborů, otevření souboru v editoru Visual Studio Code a náhled na pravé straně.

Automatické dokončování

Funkce automatického dokončování v rozšíření Visual Studio Code zobrazuje aktuální kontext, který se upravuje, a příslušné prvky automatického doplňování prostřednictvím technologie IntelliSense.

Snímek obrazovky znázorňující příklad automatického dokončování pro ID šablony stránky.

Značky Liquid

Při přizpůsobování staženého obsahu pomocí Visual Studio Code nyní můžete použít IntelliSense pro značky Liquid Power Pages.

Začněte psát a zobrazí se seznam značek Liquid. Vyberte značku, kterou chcete správně naformátovat, a pokračujte ve vstupu.

Snímek obrazovky znázorňující fragment s příkladem dokončení značky Liquid.

Objekty Liquid

Zadáním se zobrazí dokončení kódu {{ }}. S kurzorem umístěným mezi závorkami vyberte <CTRL + space> pro zobrazení seznamu objektů Liquied, které můžete vybrat. Pokud má objekt více vlastností, můžete zadat . a poté znovu vybrat <CTRL + space>, abyste zobrazili konkrétní vlastnosti objektu Liquid.

Snímek obrazovky ukazuje zadávání objektu Liquid.

Značky šablon

Chcete-li zobrazit návrhy webových šablon Power Pages, umístěte kurzor do příkazu {include ' '} a vyberte možnost <CTRL> - space. Zobrazí se seznam existujících webových šablon, abyste si mohli vybrat.

Snímek obrazovky značek šablon.

Vytváření, odstraňování a odebírání webových objektů

V rámci Visual Studio Code můžete vytvářet, odstraňovat a přejmenovávat následující webové komponenty:

  • Webové stránky
  • Šablony stránek
  • Webové šablony
  • Fragmenty obsahu
  • Nové prostředky (webové soubory)

Operace vytváření

Pomocí možností kontextové nabídky můžete vytvářet nové komponenty webu. Klikněte pravým tlačítkem na jeden z podporovaných objektů, zvolte Power Pages a vyberte typ objektu webu, který chcete vytvořit.

Případně můžete použít paletu příkazů Visual Studio Code výběrem Ctrl + Shift + P.

Vytvoření nového objektu.

Chcete-li vytvořit objekt, musíte zadat více parametrů.

Object Parametry
Webové stránky Název, šablona stránky, nadřazená stránka
Šablony stránek Název, webová šablona
Webové šablony Name
Fragmenty obsahu Název a zda bude fragment kódu HTML nebo text.
Nové prostředky (webové soubory) Název, nadřazená stránka a výběr souboru k nahrání.

Přejmenování a odstranění operací

Z navigace v souborech můžete pomocí kontextové nabídky přejmenovat nebo odstranit součásti Power Pages.

Poznámka:

Odstraněné objekty lze obnovit z desktopového koše.

Omezení

Následující omezení v současné době platí pro Power Platform Tools pro portály:

Podpora Power Pages pro Microsoft Power Platform CLI (Preview)