Del via


Rediger kode med Visual Studio Code for nettet (forhåndsvisning)

[Dette emnet inneholder dokumentasjon for forhåndsversjonen, og kan bli endret.]

Fra utformingsstudioet kan du redigere områdekode ved hjelp av Visual Studio Code for nettet. Ved hjelp av denne funksjonen kan du redigere statisk innhold, HTML, CSS, Liquid og JavaScript for følgende metadata for nettsted:

Metadata Innhold
Avanserte skjemaer (flertrinnsskjemaer) JavaScript
Standardskjemaer JavaScript
Innholdssnutter Alt innhold i innholdssnutten som støttes
Lister JavaScript
Nettfiler Vise og laste ned mediefiler. Rediger tekstfiler (kode).
Nettsider Alt støttet innhold (per språk), JavaScript og CSS
Nettmaler Alt støttet innhold

Obs!

Du kan ikke opprette metadataposter, bare legge til og redigere innhold, kode og vise/laste ned filvedlegg.

Visual Studio Code for nettet gir en gratis, null-installere Microsoft Visual Studio Code opplevelse kjører helt i nettleseren, slik at du kan bla gjennom nettstedskode og gjøre lette kodeendringer raskt og trygt. Mer informasjon: Visual Studio Code for webopplevelsen.

Viktig

  • Dette er en evalueringsfunksjonalitet.
  • Evalueringsfunksjonalitet er ikke ment for produksjonsbruk og kan ha begrenset funksjonalitet. Disse funksjonene er tilgjengelige før en offisiell utgivelse, slik at kunder kan få tidlig tilgang og gi tilbakemelding.

Demo for å bruke Visual Studio Code for webområde til å redigere Power Pages site.

Obs!

  • Første gang Visual Studio Code for nettet lastes inn, kan det ta litt tid ettersom det vil installere nødvendige utvidelser for denne funksjonen.
  • Operasjonene Opprett, Slett og Gi nytt navn støttes ikke.
  • Denne funksjonen bruker Power Platform Tools web extension. Nettutvidelser er begrenset av nettlesersandkassen og har derfor begrensninger sammenlignet med vanlige utvidelser.
    • Power Platform CLI støttes ikke.
    • Nettutvidelsesfunksjoner for Power Platform Tools er begrenset til Power Pages koderedigeringsopplevelse.
    • Denne funksjonen er ikke tilgjengelig i Government Community Cloud (GCC), Government Community Cloud (GCC High) og Forsvarsdepartementet (DoD). Brukere i disse områdene bruker Portalbehandling-appen til å redigere kode. Se Redigere kode i Portalbehandling-appen hvis du vil ha mer informasjon.

Redigere kode som er tilgjengelig i designstudio

Du kan begynne å redigere områdekoden ved hjelp av Visual Studio Code for webområdet fra hjemmesiden Power Pages ved å velge alternativet Edit-områdekode fra Edit rullegardinmenyen.

Du kan også redigere kode i utformingsstudioet fra følgende områder:

  • Redigere kode for nettsider fra arbeidsområdet for Sider
  • Kode for overskriftsmal fra arbeidsområdet Sider
  • Rediger egendefinert CSS-kode fra stilarbeidsområdet
  • Redigere egendefinert JavaScript-kode for flertrinnsskjemaer
  • Redigere egendefinert JavaScript-kode for standardskjemaer
  • Redigere egendefinert JavaScript for lister
  • Redigere innholdssnutter
  • Redigere webmaler
  • Vis og last ned medienettfiler (bilder)
  • Rediger tekstbaserte nettfiler (CSS, JavaScript, andre)

La oss se hvordan du redigerer kode ved hjelp av disse områdene.

Redigere kode for websider fra arbeidsområdet for sider

Når du åpner Power Pages utformingsstudio, ser du Edit-kode-alternativet i Sider-menyen1 og øverst til høyre på skjermen2.

Redigere kode fra arbeidsområdet for sider.

Kode for overskriftsmal fra arbeidsområdet Sider

Velg Rediger områdehode, og velg deretter Rediger kode for å åpne koderedigering.

Redigere kode fra Sider-hodet.

Rediger egendefinert CSS-kode fra stilarbeidsområdet

Gå til Stilarbeidsområde, og velg tilgjengelig egendefinert CSS Rediger kode-menyen for å åpne koderedigeringsverktøyet.

Rediger kode fra Egendefinert CSS.

Power Pages handlinger-oversikt

Med Power Pages Actions-visningen, som er tilgjengelig nederst i Filutforsker, kan du administrere Power Pages nettsteder direkte i redigeringsprogrammet. Det reduserer behovet for å bytte til Power Pages designstudio ved å la utviklere utføre vanlige oppgaver raskt fra redigeringsprogrammet.

Tilgjengelige handlinger

  • Forhåndsvisningsområde
    Denne handlingen fjerner konfigurasjonsbufferen og åpner området i VS Code. Det gjør det mulig for utviklere å forhåndsvise og teste endringer i nettstedskoden uten å måtte bytte kontekst til Power Pages designstudio.

  • Åpne i Power Pages designstudio
    Når du har gjort kodeendringer, kan du bruke denne handlingen til å gå til Power Pages designstudio. Dette er nyttig for å konfigurere godkjenningsleverandører, nettroller og andre nettstedsinnstillinger som ikke kan redigeres i koderedigeringsprogrammet.

  • Åpne i VS Code Desktop
    Hvis VS Code Desktop er installert, åpner denne handlingen nettstedet i skrivebordsprogrammet. Det utløser også en nedlasting av nettstedet, slik at koden er tilgjengelig lokalt og klar for redigering.

Power Pages Handlinger-visning i VS Code.

Varsel om flettekonflikter

Hvis du samarbeider med andre utviklere, kan det være situasjoner der du skal arbeide med samme kildekode. Hvis du prøver å lagre endringer i en utdatert fil, får du et varsel om å Sammenligne eller Overskrive endringer.

Hvis du sammenligner koden, vises gjeldende kode ved siden av koden, og du kan reversere de eksisterende endringene, godta hver endring individuelt eller bruke endringene og skrive over det eksisterende innholdet.

Flettekonflikter i kode.

Du kan se gjennom det nyeste innholdet og enten slå sammen eller skrive over koden eller forkaste endringene.

Opplæring: Redigere områdekode ved hjelp av Visual Studio Code på nettet

I denne opplæringen går du gjennom redigering av områdekoden ved hjelp av Visual Studio Code for Web.

Trinn 1: Redigere områdekode ved hjelp av Visual Studio Code for webområdet

  1. Åpne nettstedet i Power Pages designstudio

  2. Velg Rediger kode øverst til høyre

    Åpne i Visual Studio Code fra designstudioet.

  3. Velg Åpne Visual Studio Code fra bekreftelsesdialogboksen.

  4. Logg på Visual Studio Code ved hjelp av miljølegitimasjonen.

  5. Vent til Power Platform Tools-nettutvidelsen starter, og nettsidekode lastes inn i venstre rute.

Trinn 2: Oppdatere innhold og kode

  1. Utforskeren til venstre på skjermen laster inn metadata for konfigurasjon av webområde som kan redigeres ved hjelp av Visual Code for nettet.

    Explorer-menyen for et arbeidsområde uten tittel som viser nettfiler.

  2. Gjør endringer i de respektive metadatafilene, og trykk CTRL+S for å lagre endringene.

  3. Gå til designstudioet, og velg Synkroniser for å hente alle oppdateringene i den gjeldende i designstudioøkten.

    Interface for å la brukeren velge Synkroniser-knappen for å synkronisere endringer som er gjort i Visual Studio Code til design studio.

  4. Velg Forevisning for å se endringer på Power Pages-området.

Bruke Visual Studio Code på nettet eller Visual Studio Code Desktop

Brukere kan redigere, feilsøke og forhåndsvise endringer i sideredigeringer ved hjelp av Visual Studio Code for nettet uten å måtte bruke eksterne verktøy. Visual Studio Code Desktop inneholder andre avanserte funksjoner for redigering av alle metadata på nettstedet og integrering med GitHub, rammeverk og kontinuerlig integrering/kontinuerlig utvikling (CI/CD) prosesser.

Funksjon VS Code for nettet VS Code-skrivebord
Opprette nye metadataoppføringer for konfigurasjon av webområde Nei Begrenset til nettsider, sidemaler, nettmaler, innholdsutdrag og nettfiler.
Direkte områderedigering Ja Nei
Redigering av områdemetadata Begrenset til redigering av nettsider, innholdssnutter, standardskjemaer, flertrinnsskjemaer, lister og nettmaler. Konfigurasjon av alle Power Pages metadata
Forhåndsvis område Planlagt Planlagt
Støtte for Power Platform CLI Nei Ja
Avansert CPU og lagringsbundet arbeidsflyt – ReactJS eller annen støtte for rammeverkbyggverktøy Nei Ja
GitHub integrering med funksjoner som kodeinnsjekking, utsjekking, behandling av konflikter og fletting. Nei Ja

Redigere kode i Portalbehandling-appen

Obs!

  • Bruk av Visual Studio Code for nettet til å redigere nettsteder støttes ikke i Government Community Cloud (GCC), Government Community Cloud (GCC High) og Forsvarsdepartementet (DoD). Brukere i disse områdene kan bruke Portal Management-appen til å gjøre endringene sine.

Hvis området ikke støtter Visual Studio Code for nettet, vil det å velge kodeverktøyikonet </> i kommandolinjen åpne Portal Management-appen.

Naviger til de tilsvarende nettsidene, Standardskjemaer, Flertrinnsskjemaer, eller Lister eller Nettmaler-oppføringer for å redigere kode.

Type Kodeplassering
nettside Velg websideoppføring Velg oppføring for nettsideinnhold fra delen Lokalisert innhold. Sidekopiering kan redigeres i Kopier (HTML)-feltet i Generelt-fanen.Egendefinert JavaScript og Egendefinert CSS-kode kan redigeres i Avansert-fanen.
Standardskjema Velg den standardskjemaoppføringen. Rediger egendefinert JavaScript på Flere innstillinger-fanen .
Flertrinnsskjema Velg skjemaposten med flere trinn.Velg trinnet for flere trinn fra skjematrinnfanen . Rediger egendefinert JavaScript på Fanen Alternativer for skjema .
Liste Velg listeoppføringen. Rediger egendefinert JavaScript på Alternativer-fanen.
Nettmal Velg nettmaloppføringen. Rediger kilde på Generelt-fanen .

Lagre oppføringen, og forhåndsvis webområdet for å teste koden.

Se også