Del via


Rediger kode med Visual Studio Code til world wide web (prøveversion)

[Dette emne er en foreløbig udgivelse af dokumentationen, og der kan forekomme ændringer.]

Fra designstudiet kan du redigere webstedskoden ved hjælp af Visual Studio Code til Web. Denne funktion giver dig mulighed for at redigere statisk indhold, HTML, CSS, Liquid og JavaScript for følgende webstedsmetadata:

Metadata Indhold
Avancerede formularer (formularer med flere trin) JavaScript
Basisformularer JavaScript
Indholdskodestykker Alt understøttet kodestykkeindhold
Lister JavaScript
Webfiler Se og download mediefiler. Rediger tekstfiler (kode).
Websider Alt understøttet indhold (pr. sprog), JavaScript og CSS
Webskabeloner Alt understøttet indhold

Bemærk!

Du kan ikke oprette metadataposter, kun tilføje og redigere indhold, kode og få vist/downloade vedhæftede filer.

Visual Studio Code til world wide web giver dig en gratis oplevelse med nulinstallation af Microsoft Visual Studio Code, der kører udelukkende i din browser, så du kan gennemse webstedskoden og foretage ændringer af letvægtskoden hurtigt og sikkert. Flere oplysninger: Visual Studio Code til weboplevelsen.

Vigtigt!

  • Dette er en prøveversionsfunktion.
  • Prøveversionsfunktioner er ikke beregnet til produktionsformål og kan have begrænset funktionalitet. Disse funktioner er tilgængelige før en officiel udgivelse, så kunderne kan få tidlig adgang og give feedback.

Demo af at bruge Visual Studio Code til web til at redigere Power Pages site.

Bemærk!

  • Første gang Visual Studio Code for the Web indlæses, kan det tage noget tid, da det installerer de nødvendige udvidelser.
  • Handlingerne Opret fil, Slet og Omdøb understøttes ikke.
  • Denne funktion bruger webudvidelsen Power Platform Tools . Webudvidelser er begrænset af browserens sandkasse og har derfor begrænsninger sammenlignet med normale udvidelser.
    • Kommandolinjegrænsefladen for Power Platform understøttes ikke.
    • Webudvidelsesfunktioner til Power Platform Tools er begrænset til Power Pages koderedigering.
    • Denne funktion er ikke tilgængelig i GCC (Government Community Cloud), Government Community Cloud (GCC High) og DoD (Department of Defense). Brugerne i disse områder bruger appen Portalstyring til redigering af kode. Se Redigering af kode i appen Portaladministration for at få flere oplysninger.

Rediger kode, der findes i design studio

Du kan begynde at redigere webstedets kode ved hjælp af Visual Studio Code til world wide web på den Power Pages startside ved at vælge Edit-webstedskoden i rullemenuen Edit.

I designstudio kan du også redigere kode fra følgende områder:

  • Rediger websidekode fra arbejdsområdet Sider
  • Overskriftsskabelonkode fra arbejdsområdet Sider
  • Rediger brugerdefineret CSS-kode fra arbejdsområdet Typografi
  • Redigere brugerdefineret JavaScript-kode for formularer med flere trin
  • Redigere brugerdefineret JavaScript-kode for basisformularer
  • Redigere brugerdefineret JavaScript til lister
  • Redigere indholdskodestykker
  • Redigere webskabeloner
  • Se og downloade mediefilerweb (billeder)
  • Rediger tekstbaserede webfiler (CSS, JavaScript, andet)

Lad os se, hvordan du kan redigere kode ved hjælp af disse områder.

Redigere websidekode fra arbejdsområdet Sider

Når du åbner Power Pages designstudie, kan du se indstillingen Denne kode i menuen Sider1 og øverste højre hjørne af skærmen2.

Redigere kode fra arbejdsområdet Sider.

Overskriftsskabelonkode fra arbejdsområdet Sider

Vælg Rediger webstedsoverskrift, og vælg derefter Rediger kode for at åbne kodeeditoren.

Redigere kode fra sidehovedet på Sider.

Rediger brugerdefineret CSS-kode fra arbejdsområdet Typografi

Gå til arbejdsområdet Typografi, og vælg den tilgængelige brugerdefinerede CSS Rediger kode for at åbne kodeeditoren.

Rediger kode fra Brugerdefineret CSS.

Power Pages Handlingsvisning

Med visningen Power Pages Actions, der er tilgængelig nederst i Stifinder, kan du administrere Power Pages websteder direkte i editoren. Det reducerer behovet for at skifte til Power Pages design studio ved at lade udviklere udføre almindelige opgaver hurtigt fra editoren.

Tilgængelige handlinger

  • Eksempelwebsted
    Denne handling rydder konfigurationscachen og åbner webstedet i VS Code. Det gør det muligt for udviklere at få vist og teste ændringer af webstedskoden uden at skulle skifte kontekst til Power Pages design studio.

  • Åbn i Power Pages design studio
    Når du har foretaget kodeændringer, skal du bruge denne handling til at gå til Power Pages design studio. Dette er nyttigt til konfiguration af godkendelsesprovidere, webroller og andre webstedsindstillinger, der ikke kan redigeres i kodeeditoren.

  • Åbn i VS Code Desktop
    Hvis VS Code Desktop er installeret, åbner denne handling webstedet i skrivebordsappen. Den udløser også download af et websted, der sikrer, at koden er tilgængelig lokalt og klar til redigering.

Handlinger i Power Pages-visningen i VS Code.

Meddelelse om fletning af konflikter

Hvis du samarbejder med andre udviklere, kan der være situationer, hvor du arbejder på den samme kildekode. Hvis du forsøger at gemme ændringer i en forældet fil, får du besked om at sammenligne eller overskrive ændringer.

Hvis du sammenligner koden, vises den aktuelle kode sammen med din kode, og du kan vende tilbage til de eksisterende ændringer, acceptere de enkelte ændringer for sig eller bruge ændringerne og overskrive det eksisterende indhold.

Flette konflikter i kode.

Du kan gennemgå det nyeste indhold og enten flette eller overskrive koden eller kassere ændringerne.

Vejledning: Rediger webstedskode ved hjælp af Visual Studio Code til webben

I dette selvstudium gennemgår du redigering af webstedskoden ved hjælp af Visual Studio Code til internettet.

Trin 1: Rediger webstedskode ved hjælp af Visual Studio Code til world wide web

  1. Åbn dit websted i Power Pages design studio

  2. Vælg Rediger kode i øverste højre hjørne

    Åbn i Visual Studio Code fra design studio.

  3. Vælg Åbn Visual Studio Code i bekræftelsesdialogboksen.

  4. Log på Visual Studio Code ved hjælp af legitimationsoplysningerne for dine miljøer.

  5. Vent på, at Power Platform Tools-webudvidelsen initialiseres, og at websidekoden indlæses i venstre rude.

Trin 2: Opdatering af indhold og kode

  1. Stifinderen i venstre side af skærmen indlæser de respektive metadata til konfiguration af websteder, der kan redigeres ved hjælp af Visual Code til internettet.

    Explorer-menuen for et ikke-navngivet arbejdsområde, der viser webfiler.

  2. Foretag ændringer af de respektive metadatafiler, og tryk på Ctrl+S for at gemme ændringerne.

  3. Gå til design studio, og vælg Synkroniser for at trække alle opdateringerne i din nuværende design studiosession.

    Interface for at give brugeren mulighed for at vælge knappen Synkroniser for at synkronisere ændringer, der er foretaget i Visual Studio Code til design studio.

  4. Vælg Prøve for at se ændringer på det Power Pages websted.

Brug af Visual Studio Code til world wide web eller Visual Studio Code Desktop

Brugerne kan redigere, foretage fejlfinding og få vist ændringer af sideredigeringer ved hjælp af Visual Studio Code til world wide web uden at skulle bruge eksterne værktøjer. Visual Studio Code Desktop indeholder andre avancerede funktioner til redigering af alle webstedsmetadata og integration med GitHub, strukturer og kontinuerlig integration/løbende udviklingsprocesser (CI/CD).

Funktion VS Code til internettet VS Code-skrivebord
Oprette nye metadataposter til konfiguration af websted Nej Begrænset til websider, sideskabeloner, webskabeloner, indholdskodestykker og webfiler.
Redigering af direkte websted Ja Nej
Redigering af webstedsmetadata Begrænset til redigering af websider, indholdskodestykker, basisformularer, formularer med flere trin, lister og webskabeloner. Alle Power Pages metadatakonfiguration
Forhåndsversion af websted Planlagt Planlagt
Power Platform CLI-support Nej Ja
Avanceret CPU- og lagerbundet arbejdsproces – Understøttelse af ReactJS eller andre strukturopbygningsværktøjer Nej Ja
GitHub integration med funktioner som indtjekning af kode, udtjekning, administration af konflikter og fletning. Nej Ja

Redigere kode i portalstyringsappen

Bemærk!

  • Brug af Visual Studio Code til internettet til at redigere websteder understøttes ikke i GCC (Government Community Cloud), GCC High (Government Community Cloud) og DoD (Department of Defense). Brugere i disse områder kan bruge portaladministrationsappen til at foretage deres ændringer.

Hvis området ikke understøtter Visual Studio Code for world wide web åbnes appen Portal Management3, når du vælger ikonet for kodeeditoren / på kommandolinjen.

Naviger til de tilsvarende websider, Basisformularer, Formularer med flere trin, Lister eller Webskabelon-poster til at redigere kode.

Skriv Kodeplacering
webside Vælg webstedspost. Vælg en post for indhold på websiden i sektionen Oversat indhold. Sidekopi kan redigeres i feltet Kopiér (HTML) på fanen Generelt.Brugerdefineret JavaScript og Brugerdefineret CSS-kode kan redigeres fra fanen Avanceret.
Basisformular Vælg den grundlæggende formularpost. Rediger brugerdefineret JavaScript under fanen Yderligere indstillinger .
Formular med flere trin Vælg posten med flere trin i formularen.Vælg trinnet med flere trin i formularen under fanen Formulartrin . Rediger brugerdefineret JavaScript på fanen Formularindstillinger .
List Vælg listeposten. Rediger brugerdefineret JavaScript under fanen Indstillinger .
Webskabelon Vælg webskabelonposten. Rediger kilde under fanen Generelt .

Gem posten, og gennemse webstedet for at teste koden.

Se også