Partajați prin


Folosiți extensia Visual Studio Code

Visual Studio Code este un editor de cod sursă ușor, dar puternic, care rulează pe desktop și este disponibil pentru Windows, macOS și Linux. Acesta vine cu asistență încorporată pentru JavaScript, TypeScript și Node.js și are un ecosistem bogat de extensii pentru alte limbaje (cum ar fi C+, C#, Java, Python, PHP și Go) și runtime (cum ar fi .NET și Unity). Pentru mai multe informații, consultați Începeți cu VS Code.

Visual Studio Code vă permite să vă extindeți capacitatea prin extensii. Extensiile Visual Studio Code pot adăuga mai multe caracteristici experienței generale. Odată cu lansarea acestei caracteristici, veți putea utiliza acum extensia Visual Studio Code pentru a lucra cu Power Pages.

Extensia Visual Studio Code pentru Power Pages

Power Platform Tools adaugă capacitatea de a configura site-uri web folosind Visual Studio Code și de a utiliza limbajul Liquid încorporat IntelliSense permițând ajutor pentru completarea codului, asistență și sugestii în timpul particularizării interfeței pentru site-uri web folosind Visual Studio Code. Folosind extensia Visual Studio Code, puteți configura portaluri și prin intermediul Microsoft Power Platform CLI.

Notă

  • Va trebui să vă asigurați că node.js este descărcat și instalat pe aceeași stație de lucru ca Visual Studio Code pentru ca să funcționeze caracteristicile Power Pages.
  • Asigurați-vă că sunt instalate doar Power Platform Tools, nu și Power Platform Tools, și Power Platform Tools [VERSIUNE PRELIMINARĂ]. Consultați problemele cunoscute pentru detalii.

Animație care explică modul de instalare și setare pentru Power Platform Tools.

Cerințe preliminare

Înainte de a utiliza extensia Visual Studio Code pentru Power Pages, trebuie:

Instalați extensia Visual Studio Code

După ce instalați Visual Studio Code, trebuie să instalați extensia pentru insertul Power Platform Tools pentru Visual Studio Code.

Pentru a instala extensia Visual Studio Code:

  1. Deschideți Visual Studio Code.

  2. Selectați Extensii din panoul din stânga.

    Extensia Visual Studio Code.

  3. Selectați pictograma Setări din partea dreaptă sus din panoul de extensii.

  4. Căutați și selectați Power Platform Tools.

    Selectați Power Platform Tools.

  5. Selectați Instalare.

  6. Verificați dacă extensia este instalată cu succes din mesajele privind starea.

Descărcați conținutul site-ului web

Pentru autentificare într-un mediu Microsoft Dataverse și pentru a descărca conținutul site-ului web, consultați tutorialul Utilizarea Microsoft Power Platform CLI cu Power Pages - descărcați conținutul portalurilor.

Sfat

Extensia Power Platform Tools permite automat utilizarea comenzilor Microsoft Power Platform CLI din Visual Studio Code prin Terminalul Integrat Visual Studio.

Pictogramele fișierului

Extensia Visual Studio Code pentru Power Pages identifică și afișează automat pictograme pentru fișiere și foldere din conținutul site-ului descărcat.

Lista fișierelor dintr-un șablon de pornire cu tema pictogramei fișierului specifică site-urilor web.

Visual Studio Code folosește tema implicită pentru pictogramele de fișiere, care nu afișează pictograme specifice Power Pages. Pentru a vizualiza pictogramele de fișiere specifice site-urilor dvs., va trebui să actualizați instanța Visual Studio Code pentru a utiliza tema pictogramei de fișiere specifice Power Pages.

Pentru a activa o temă de pictogramă fișier specifică portalurilor:

  1. Deschideți Visual Studio Code.

  2. Accesați Fișier>Preferințe>Temă>Temă pictograme fișiere

  3. Selectați tema pentru pictogramele de portaluri PowerApps.

    Selectați tema pentru icoane de portaluri Power Apps.

Previzualizare în timp real

Extensia Visual Studio Code permite o opțiune de previzualizare live pentru a vizualiza pagina de conținut Power Pages din interfața Visual Studio Code în timpul experienței de dezvoltare.

Pentru a vedea previzualizarea, selectați Buton Previzualizare. din dreapta sus când aveți un fișier HTML deschis în mod editare.

Previzualizare pagină.

Panoul de previzualizare se deschide în partea dreaptă a paginii în curs de editare.

Un ecran cu lista de fișiere, fișier deschis în editorul Visual Studio Code și o previzualizare în partea dreaptă.

Funcția de previzualizare necesită ca celelalte fișiere să fie, de asemenea, deschise în aceeași sesiune de Visual Studio Code care alcătuiește marcajul HTML pentru afișarea previzualizării. De exemplu, dacă numai fișierul HTML este deschis fără structura de dosare deschisă utilizând Visual Studio Code, veți vedea următorul mesaj.

Rularea comenzii contribuite: „microsoft-powerapps-portals.preview-show” nu a reușit.

Când apare această problemă, deschideți folderul folosind Fișier > Deschideți folderul și selectați folderul de conținut al site-ului descărcat pentru a-l deschide înainte de a încerca din nou să previzualizați.

Completare automată

Capacitatea de completare automată din extensia Visual Studio Code arată contextul curent în curs de editare și elementele relevante de completare automată prin IntelliSense.

Un exemplu de completare automată pentru ID-ul șablonului de pagină.

Etichete Liquid

Când personalizați conținutul descărcat utilizând Visual Studio Code, puteți utiliza acum IntelliSense pentru Power Pages Etichete Liquid.

Începeți prin a tasta și va apărea o listă de etichete Liquid, odată ce selectați eticheta, aceasta va fi formatată corect și gata pentru mai multe introduceri.

Fragment cu un exemplu de completare a etichetei Liquid.

Obiecte Liquid

Puteți vedea completări de cod pentru obiectul Liquid introducând {{ }}. Cu cursorul plasat între paranteze, selectați <CTRL + space> pentru a afișa o listă de obiecte Liquid pe care le puteți selecta. Dacă obiectul are mai multe proprietăți, puteți introduce a . și apoi selectați <CTRL + space> din nou pentru a vedea proprietățile specifice ale obiectului Liquid.

Introducerea unui obiect Liquid.

Etichete de șablon

Puteți vedea sugestii de șabloane web Power Pages prin plasarea cursorului în declarația {include ' '} și selectați <CTRL> - space. Va apărea o listă de șabloane web existente pe care să le selectați.

Etichete de șablon.

Creați, ștergeți și redenumiți obiectele site-ului web

Din cadrul Visual Studio Code, puteți crea, șterge și redenumi următoarele componente ale site-ului web:

  • Pagini web
  • Șabloane de pagini
  • Șabloane web
  • Fragmente de conținut
  • Active noi (fișiere web)

Creați operațiuni

Puteți utiliza opțiunile meniului contextual pentru a crea noi componente ale site-ului web, selectați cu clic dreapta unul dintre obiectele acceptate, alegeți Power Pages și selectați tipul de obiect al site-ului web pe care doriți să îl creați.

Sau puteți utiliza paleta de comenzi Visual Studio Code selectând Ctrl + Shift + P.

Creați un nou obiect.

Va trebui să specificați mai mulți parametri pentru a crea obiectul.

Obiect Parametri
Pagini web Nume, șablon de pagină, pagină părinte
Șabloane de pagini Nume, șablon web
Șabloane web Nume
Fragmente de conținut Nume și dacă fragmentul va fi HTML sau text.
Active noi (fișiere web) Nume, pagina părinte și selectați fișierul de încărcat.

Operațiunile de redenumire și ștergere

Din navigarea fișierelor, puteți folosi meniul contextual pentru a redenumi sau a șterge componentele Power Pages.

Notă

Obiectele șterse pot fi restaurate din coșul de reciclare de pe desktop.

Limitări

Următoarele limitări se aplică în prezent Power Platform Tools pentru portaluri:

Consultați și

Asistență Power Pages pentru Microsoft Power Platform CLI (versiune preliminară)