Editați codul folosind Visual Studio Code pentru web (versiune preliminară)

[Acest subiect este documentație preliminară și poate fi modificat.]

Din studioul de proiectare, puteți edita codul site-ului utilizând Visual Studio Code pentru web. Această funcție vă permite să editați conținut static, HTML, CSS, Liquid și JavaScript pentru următoarele metadate de site:

Metadate	Conținut
Formulare avansate (formulare cu mai mulți pași)	JavaScript
Forme de bază	JavaScript
Fragmente de conținut	Tot conținutul de fragmente de conținut acceptat
Liste	JavaScript
Fișiere web	Vizualizați și descărcați fișiere media. Editați fișierele text (cod).
Pagini web	Tot conținutul acceptat (per limbă), JavaScript și CSS
Șabloane web	Tot conținutul acceptat

Notă

Nu veți putea crea înregistrări de metadate, ci doar adăuga și edita conținut, cod și vizualiza/descărca fișiere atașate.

Visual Studio Code pentru Web oferă o experiență Microsoft Visual Studio Code gratuită, fără instalare, care rulează în întregime în browser, permițându-vă să răsfoiți codul site-ului și să efectuați modificări ușoare ale codului rapid și în siguranță. Mai multe informații: Visual Studio Code pentru experiența web.

Important

• Aceasta este o caracteristică de previzualizare.
• Caracteristicile în regim de previzualizare nu sunt destinate utilizării în producție și pot avea funcționalitate restricționată. Aceste caracteristici sunt disponibile înainte de lansarea oficială, astfel încât clienții să poată obține acces din timp și să poată oferi feedback.

Notă

• La prima încărcare a Visual Studio Code pentru Web ar putea dura ceva timp, deoarece se vor instala extensiile necesare pentru această caracteristică.
• Operațiunile de creare, ștergere și redenumire a fișierelor nu sunt acceptate.
• Această caracteristică utilizează extensia web Power Platform Tools . Extensiile web sunt restricționate de sandbox-ul browserului și, prin urmare, au limitări în comparație cu extensiile normale.
  • CLI Power Platform nu este acceptat.
  • Caracteristicile extensiei web Power Platform Tools sunt limitate la experiența de editare a codului Power Pages.
  • Această caracteristică nu este disponibilă în Government Community Cloud (GCC), Government Community Cloud (GCC High) și Department of Defense (DoD). Utilizatorii din aceste regiuni vor folosi aplicația de gestionare a portalurilor pentru editarea codului. Consultați Editarea codului în aplicația de gestionare a portalurilor pentru mai multe informații.

Editați codul disponibil în studioul de design

Puteți începe să editați codul site-ului dvs. folosind Visual Studio Cod pentru Web de la Power Pages pagina principală alegând Editați codul site-ului opțiune din partea Edita meniu derulant.

De asemenea, puteți edita cod în studioul de design din următoarele zone:

• Editați codul paginii web din spațiul de lucru Pages
• Codul șablonului de antet din spațiul de lucru Pages
• Editare personalizată CSS cod din spațiul de lucru Styling
• Editați codul JavaScript personalizat pentru formularele cu mai mulți pași
• Editați codul JavaScript personalizat pentru formularele de bază
• Editați codul JavaScript particularizat pentru liste
• Editați fragmentele de conținut
• Editați șabloanele web
• Vizualizați și descărcați fișiere media. web (imagini)
• Editați fișiere web bazate pe text (CSS, JavaScript, altele)

Să vedem cum să editați codul folosind aceste zone.

Editați codul paginii web din spațiul de lucru Pagini

Când deschideți studioul de design Power Pages, vedeți opțiunea Editați codul în meniul Pagini¹ și în colțul din dreapta sus al ecranului².

Cod șablon de antet din spațiul de lucru Pagini

Selectați Editați antetul site-ului și apoi selectați Editați codul pentru a deschide editorul de cod.

Editați codul CSS personalizat din spațiul de lucru Stil

Accesați spațiul de lucru Stil și selectați meniul personalizat CSS Editați codul disponibil pentru a deschide editorul de cod.

Vizualizarea Acțiuni Power Pages

Vizualizarea Acțiuni Power Pages , accesibilă în partea de jos a File Explorer, vă permite să gestionați site-urile Power Pages direct în editor. Reduce necesitatea de a trece la Power Pages Design Studio, permițând dezvoltatorilor să execute rapid sarcini comune din interiorul editorului.

Acțiuni disponibile

• Previzualizați site-ul
  Această acțiune șterge memoria cache de configurare și deschide site-ul în VS Code. Permite dezvoltatorilor să previzualizeze și să testeze modificările codului site-ului fără a fi nevoie să schimbe contextul către Power Pages Design Studio.

• Deschide în studioul de design Power Pages
  După ce faci modificări de cod, folosește această acțiune pentru a accesa Power Pages Design Studio. Acest lucru este util pentru configurarea furnizorilor de autentificare, a rolurilor web și a altor setări de site care nu pot fi editate în editorul de cod.

• Deschidere în VS Code Desktop
  Dacă este instalat VS Code Desktop, această acțiune deschide site-ul în aplicația desktop. De asemenea, declanșează o descărcare a site-ului, asigurându-se că codul este disponibil local și gata de editare.

Notificare privind un conflict de îmbinare

Dacă colaborați cu alți dezvoltatori, pot exista situații în care veți lucra la același cod sursă. În cazul în care încercați să salvați modificările aduse unui fișier învechit, veți primi o notificare pentru compararea sau înlocuirea schimbărilor.

Compararea codului va afișa codul curent alături de codul dvs. și vă va permite să reveniți la modificările existente, să acceptați fiecare modificare individual sau să utilizați modificările și să suprascrieți conținutul existent.

Veți putea să examinați cel mai recent conținut și să îmbinați sau să înlocuiți codul sau să renunțați la modificări.

Tutorial: Editați codul site-ului folosind Visual Studio Code pentru web

În acest tutorial, parcurgeți editarea codului site-ului folosind Visual Studio Code pentru web.

Pasul 1: Editați codul site-ului folosind Visual Studio Cod pentru Web

1. Deschideți site-ul în studioul de proiectare Power Pages

2. În colțul din dreapta sus, selectați Editați codul

   

3. Selectați Deschideți Visual Studio Code din dialogul de confirmare.

4. Conectați-vă la Visual Studio Code cu acreditările dvs. pentru mediu.

5. Așteptați să se inițializeze extensia web Power Platform Tools și să se încarce codul paginii web în panoul din stânga.

Pasul 2: Actualizați conținutul și codul

1. Exploratorul din partea stângă a ecranului încarcă metadatele respective de configurare a site-ului web care pot fi editate folosind Visual Code pentru Web.

   

2. Efectuați modificări la fișierele de metadate respective și apăsați Ctrl+S pentru a salva modificările.

3. Accesați studioul de proiectare și selectați Sincronizare pentru a extrage toate actualizările din sesiunea curentă a studioului de proiectare.

   

4. Selectați Previzualizarepentru a examina modificările de pe site-ul Power Pages.

Folosind Visual Studio Cod pentru Web sau Visual Studio Code Desktop

Utilizatorii pot edita, depana și previzualiza modificările editărilor de pagină utilizând Visual Studio Code pentru web fără a fi nevoie să folosească instrumente externe. Visual Studio Code Desktop oferă și alte funcții avansate pentru editarea tuturor metadatelor site-ului și integrarea cu GitHub, framework-uri și procese de integrare continuă/dezvoltare continuă (CI/CD).

Caracteristică	Cod VS pentru Web	VS Code Desktop
Creați noi înregistrări de metadate de configurare a site-ului web	No	Limitat la pagini web, șabloane de pagini, șabloane web, fragmente de conținut și fișiere web.
Editarea directă a site-ului	Da	No
Editarea metadatelor site-ului	Limitat la editarea paginilor web, fragmentelor de conținut, formularelor de bază, formularelor cu mai mulți pași, listelor și șabloanelor web.	Configurarea tuturor metadatelor Power Pages
Previzualizarea site-ului	Planificat	Planificat
Power Platform Interfață de comandă (CLI) sprijin	No	Da
Procesor avansat și flux de lucru legat de stocare - ReactJS sau alt instrument de construcție a cadrului	No	Da
Integrarea cu GitHub, cu capabilități cum ar fi înregistrarea codului, verificarea, gestionarea conflictelor și îmbinarea.	No	Da

Editarea codului în aplicația de gestionare a portalurilor

Notă

• Utilizarea Visual Studio Code pentru Web pentru a edita site-uri web nu este acceptată în Government Community Cloud (GCC), Government Community Cloud (GCC High) și Departamentul Apărării (DoD). Utilizatorii din aceste regiuni pot folosi aplicația Portal Management pentru a-și face modificările.

Dacă regiunea nu suportă codul Visual Studio pentru Web, selectarea pictogramei <editorului de cod /> bara de comenzi va deschide aplicația Portal Management.

Navigați la înregistrările de pagini web corespunzătoare, Formulare de bază, Formulare cu mai mulți pași, Liste sau Șabloane web pentru editarea codului.

Tipul	Locație cod
Pagină web	Selectați înregistrarea paginii web. Selectați înregistrarea de conținut a paginii web din Conținut localizat secțiune. Copia paginii poate fi editată în Copiere (HTML) câmp pe General filă. JavaScript personalizat şi Personalizat CSS codul poate fi editat din Avansat filă.
Formular de bază	Selectați înregistrarea formularului de bază. Editați JavaScript personalizat în fila Setări suplimentare .
Formular cu mai mulți pași	Selectați înregistrarea formularului în mai mulți pași. Selectați pasul formularului în mai mulți pași din fila Pași formular . Editați JavaScript personalizat în fila Opțiuni formular .
Listă	Selectați înregistrarea listei. Editați JavaScript personalizat pe fila Opțiuni .
Șablon web	Selectați înregistrarea șablonului web. Editați sursa pe fila General .

Salvați înregistrarea și previzualizați site-ul pentru a vă testa codul.

Consultați și

• Utilizare Visual Studio Cod și Microsoft Power Platform Interfață de comandă (CLI)