Použitie rozšírenia Visual Studio Code
Visual Studio Code je ľahký, ale výkonný editor zdrojového kódu, ktorý je spustený na pracovnej ploche a je k dispozícii pre systémy Windows, macOS a Linux. Dodáva sa so zabudovanou podporou pre JavaScript, TypeScript a Node.js a má bohatý ekosystém rozšírení pre ďalšie jazyky (napríklad C++, C#, Java, Python, PHP a Go) a modulov runtime (napríklad .NET a Unity). Ďalšie informácie nájdete v téme Začíname s VS Code.
Visual Studio Code vám umožňuje rozšíriť vaše schopnosti prostredníctvom rozšírení. Visual Studio Code rozšírenia môžu pridať k celkovému zážitku ďalšie funkcie. Po vydaní tejto funkcie teraz môžete použiť Visual Studio Code rozšírenie na prácu s Power Pages.
Visual Studio Code rozšírenie pre Power Pages
Nástroje Power Platform Tools pridávajú možnosť konfigurovať webové stránky pomocou Visual Studio Code a používať vstavaný jazyk Liquid IntelliSense na umožnenie pomoci pri dokončovaní kódu, asistencie a nápovedy pri prispôsobovaní rozhrania webových stránok pomocou Visual Studio Code. Pomocou rozšírenia Visual Studio Code môžete portály konfigurovať aj prostredníctvom Microsoft Power Platform CLI.
Poznámka
- Budete sa musieť uistiť, že node.js je stiahnutý a nainštalovaný na rovnakej pracovnej stanici ako Visual Studio Code, aby fungovali funkcie Power Pages.
- Uistite sa, že sú nainštalované iba Power Platform Tools a nie obe Power Platform Tools a Power Platform Tools [PREVIEW ]. Pre ďalšie podrobnosti pozri známe problémy.
Požiadavky
Pred použitím rozšírenia Visual Studio Code pre Power Pages musíte:
Stiahnite si, nainštalujte a nakonfigurujte si Visual Studio Code. Viac informácií: Stiahnite si Visual Studio Code
Nakonfigurujte svoje prostredie a systém pre Power Pages pomocou CI/CD pomocou CLI. Ďalšie informácie: Microsoft Power Platform CLI (náhľad)
Inštalácia rozšírenia Visual Studio Code
Po inštalácii Visual Studio Code si musíte nainštalovať rozšírenie pre doplnok nástrojov Power Platform Tools pre Visual Studio Code.
Inštalácia rozšírenia Visual Studio Code:
Otvorte Visual Studio Code.
Vyberte položku Rozšírenia z ľavej tably.
Stlačte ikonu Nastavenia v pravom hornom rohu na paneli rozšírení.
Vyhľadajte a vyberte Power Platform Tools.
Vyberte Nainštalovať.
Skontrolujte, či je rozšírenie úspešne nainštalované zo stavových správ.
Stiahnite si obsah webovej stránky
Na autentifikáciu v porovnaní s prostredím Microsoft Dataverse a načítanie obsahu webovej stránky si pozrite návod Používanie Microsoft Power Platform CLI s Power Pages - stiahnutie obsahu webovej stránky.
Prepitné
Rozšírenie Power Platform Tools automaticky umožňuje použitie príkazov Microsoft Power Platform CLI z Visual Studio Code prostredníctvom Visual Studio integrovaného terminálu.
Ikony súborov
Prípona Visual Studio Code pre Power Pages automaticky identifikuje a zobrazuje ikony súborov a priečinkov vo vnútri stiahnutého obsahu webovej stránky.
Visual Studio Code používa predvolený motív ikony súboru, ktorý nezobrazuje špecifické ikony Power Pages. Ak chcete zobraziť ikony súborov špecifické pre vaše webové stránky, budete musieť aktualizovať inštanciu Visual Studio Code, aby ste mohli používať motív ikony súboru špecifický pre Power Pages.
Povolenie motívu ikony súboru špecifickej pre portály:
Otvorte Visual Studio Code.
Prejdite na Súbor>Preferencie>Téma>Téma ikony súboru
Vyberte tému pre Ikony PowerApps portálov.
Živá ukážka
Rozšírenie Visual Studio Code umožňuje možnosť živého náhľadu na prezeranie obsahovej stránky Power Pages vnútri rozhrania Visual Studio Code v prostredí na vývoj.
Ak chcete zobraziť náhľad, vyberte vpravo hore, keď máte súbor HTML otvorený v režime úprav.
Na pravej strane upravovanej stránky sa otvorí tabla s ukážkou.
Funkcia náhľadu vyžaduje, aby boli ostatné súbory tiež otvorené v tej istej relácii Visual Studio Code, ktorá tvorí značku HTML na zobrazenie náhľadu. Napríklad ak sa otvorí iba súbor HTML bez otvorenia štruktúry priečinkov pomocou Visual Studio Code, zobrazí sa nasledujúca správa.
Keď nastane tento problém, otvorte priečinok pomocou Súbor > Otvoriť priečinok a vyberte priečinok s obsahom stiahnutej webovej stránky, ktorý sa má otvoriť, skôr ako sa pokúsite znova zobraziť náhľad.
Automatické dokončovanie
Schopnosť automatického dopĺňania v rozšírení Visual Studio Code zobrazuje aktuálny upravovaný kontext a príslušné prvky automatického dopĺňania prostredníctvom technológie IntelliSense.
Značky Liquid
Pri prispôsobovaní stiahnutého obsahu pomocou Visual Studio Code teraz môžete používať IntelliSense pre Power Pages Značky Liquid.
Začnite písaním a zobrazí sa zoznam značiek Liquid. Keď značku vyberiete, bude správne naformátovaná a pripravená na ďalšie zadávanie.
Objekty Liquid
Môžete vidieť vyplnenia kódu Objekt Liquid zadaním {{ }}
. S kurzorom umiestneným medzi zátvorkami vyberte <CTRL + space>
pre zobrazenie zoznamu objektov Liquid, ktoré môžete vybrať. Ak má objekt viac vlastností, môžete zadať . a potom znova vybrať <CTRL + space>
, aby ste videli špecifické vlastnosti objektu Liquid.
Značky šablón
Návrhy webových šablón Power Pages môžete zobraziť umiestnením kurzora do príkazu {include ' '}
a výberom možnosti <CTRL> - space
. Zobrazí sa zoznam existujúcich webových šablón, z ktorých si môžete vybrať.
Vytvárajte, odstraňujte a premenovávajte objekty webových stránok
V rámci Visual Studio Code môžete vytvoriť, odstrániť a premenovať nasledujúce komponenty webovej lokality:
- Webové stránky
- Šablóny stránok
- Webové šablóny
- Úryvky obsahu
- Nové aktíva (Webové súbory)
Vytvorenie operácií
Na vytvorenie nových komponentov webovej lokality môžete použiť možnosti kontextového menu, pravým tlačidlom myši vyberte jeden z podporovaných objektov, vyberte Power Pages a vyberte typ objektu webovej lokality, ktorý chcete vytvoriť.
Prípadne môžete použiť príkazovú paletu Visual Studio Code výberom možnosti Ctrl + Shift + P
.
Na vytvorenie objektu budete musieť zadať viac parametrov.
Object | Parametre |
---|---|
Webové stránky | Názov, šablóna stránky, nadradená stránka |
Šablóny stránok | Názov, webová šablóna |
Webové šablóny | Name |
Úryvky obsahu | Názov a či bude zlomok kódu HTML alebo text. |
Nové aktíva (Webové súbory) | Názov, nadradená stránka a výber súboru na odovzdanie. |
Operácie premenovať a odstrániť
Z navigácie v súbore môžete použiť kontextové menu na premenovanie alebo odstránenie Power Pages komponentov.
Poznámka
Vymazané objekty je možné obnoviť z koša na pracovnej ploche.
Obmedzenia
Nasledujúce obmedzenia v súčasnosti platia pre Power Platform Tools pre portály:
- Funkcie Automatické doplnenie podporujú iba obmedzenú funkčnosť.
- Živý náhľad nepodporuje témy alebo objekty Liquid.
Pozrite si tiež
Power Pages podpora pre Microsoft Power Platform CLI (náhľad)