Använd tillägget för Visual Studio Code

Visual Studio Code är en enkel men kraftfull källkodsredigerare som körs på datorn och finns för Windows, macOS och Linux. Den levereras med inbyggt stöd för JavaScript, TypeScript och Node.js och har ett rikt ekosystem med tillägg för andra språk (som C++, C#, Java, Python, PHP och Go) och körtider (t.ex. .NET och Unity). Mer information finns i Kom igång med VS Code.

Med Visual Studio Code kan du utöka kapaciteten med hjälp av tillägg. Visual Studio Code-tillägg kan tillföra fler funktioner i helhetsupplevelsen. Med den här funktionen kan du nu använda Visual Studio Code-tillägget för att arbeta med Power Pages.

Visual Studio Code-tillägg för Power Pages

Power Platform Tools lägger till funktionen att konfigurera webbplatser med Visual Studio Code, samt att använda det inbyggda Liquid-språket IntelliSense som ger hjälp med slutförande av kod, assistans och tips samtidigt som webbplatsgränssnitt anpassas med hjälp av Visual Studio Code. Med Visual Studio Code-tillägget kan du också konfigurera webbplatser via Microsoft Power Platform CLI.

Förutsättningar

Innan du använder Visual Studio Code-tillägget för Power Pages, måste du:

• Hämta, installera och konfigurera Visual Studio Code. Mer information: Hämta Visual Studio Code

• Konfigurera miljön och systemet för Power Pages CI/CD-stöd med hjälp av CLI. Mer information: Microsoft Power Platform CLI (förhandsversion)

Installera Visual Studio Code-tillägget

När du har installerat Visual Studio Code måste du installera tillägget för plugin-programmet Power Platform Tools för Visual Studio Code.

Så här installerar du Visual Studio Code-tillägget:

1. Öppna Visual Studio Code.

2. Välj anläggningar i den vänstra rutan.

   

3. Välj ikonen Inställningar högst upp till höger i fönstret med tillägg.

4. Sök efter och välj Power Platform Tools.

   

5. Välj Installera.

6. Kontrollera att tillägget har installerats korrekt från statusmeddelandena.

Hämta webbplatsinnehåll

Om du vill autentisera mot en Microsoft Dataverse-miljö eller hämta webbplatsinnehåll, läs då självstudierna Använd Microsoft Power Platform CLI med Power Pages – hämta webbplatsinnehåll.

Filikoner

Visual Studio Code-tillägget för Power Pages identifierar och visar automatiskt ikoner för filer och mappar i innehållet i de hämtade webbplatserna.

Visual Studio Code använder standard filikontema som inte innehåller Power Pages-specifika ikoner. Om du vill visa filikoner som är specifika för webbplatserna måste du uppdatera Visual Studio Code-instansen så att den Power Pages-specifika filikonen används.

Så här aktiverar du en portalspecifik filikon:

1. Öppna Visual Studio Code.

2. Gå till Arkiv>Inställningar>Tema>Filikontema

3. Välj temat för PowerApps-portalikoner.

   

Förhandsgranskning i realtid

Tillägget Visual Studio Code möjliggör en förhandsgranskning i realtid, för att visa Power Pages-innehållssidan i Visual Studio Code-gränssnittet under utvecklingsupplevelsen.

Om du vill visa förhandsgranskningen väljer du längst upp till höger när du har en HTML-fil öppen i redigeringsläge.

Förhandsgranskningsfönstret öppnas till höger om den sida som redigeras.

Förhandsgranskningsfunktionen kräver att de andra filerna också är öppna i samma Visual Studio Code-session som utgör HTML-pålägget för att förhandsgranskningen ska visas. Om till exempel endast HTML-filen öppnas utan att mappstrukturen har öppnats med Visual Studio Code, visas följande meddelande:

När detta problem uppstår, öppna mappen med Fil > Öppna mappen och välj den nedladdade webbplatsinnehållsmappen som ska öppnas innan du försöker förhandsgranska igen.

Komplettera automatiskt

Funktionen för automatisk komplettering i Visual Studio Code-tillägget visar det aktuella sammanhanget som redigeras och relevanta element för automatisk komplettering via IntelliComplete.

Liquid-taggar

När du anpassar hämtat innehåll med hjälp av Visual Studio Code, kan du nu använda IntelliSense för Power Pages Liquid-taggar.

Börja med att skriva så visas en lista med Liquid-taggar som visas, när du har valt taggen, formaterad på rätt sätt och redo för mer indata.

Liquid-objekt

Du kan visa slutförande av Liquid-objekt kod genom att ange {{ }}. När markören är placerad mellan objekten väljer du <CTRL + space> för att visa en lista över objekt som du kan välja. Om objektet har fler egenskaper kan du ange en . och välj sedan <CTRL + space> igen om du vill visa specifika egenskaper för Liquid-objektet.

Malltaggar

Du kan visa förslag på Power Pages-webbmall genom att placera markören i {include ' '} instruktionen och markera den <CTRL> - space. Du kan välja en lista med befintliga webbmallar.

Skapa, ta bort och byta namn på webbplatsobjekt

Inifrån Visual Studio Code kan du skapa, ta bort och byta namn på följande webbplatskomponenter:

• Webbsidor
• Sidmallar
• Webbmallar
• Innehållsavsnitt
• Nya tillgångar (webbfiler)

Skapa åtgärder

Du kan använda alternativen på snabbmenyn för att skapa nya webbplatskomponenter, högerklicka på ett av de objekt som stöds, välja Power Pages och välj den webbplats objekttyp du vill skapa.

Du kan också använda kommandopaletten Visual Studio Code genom att välja Ctrl + Shift + P.

Du måste ange fler parametrar för att skapa objektet.

Åtgärderna byt namn och ta bort

Från filnavigeringen kan du använda snabbmenyn för att byta namn på eller ta bort Power Pages-komponenter.

Begränsningar

Följande begränsningar gäller för närvarande Power Platform Tools för portaler:

• Funktionerna Komplettera automatiskt stöder endast begränsad funktion.
• Live-förhandsgranskning stöder inte anpassade teman eller Liquid-objekt.

Se även

Power Pages-stöd för Microsoft Power Platform CLI (förhandsversion)