Editar código con Visual Studio Code para a web (versión preliminar)

[Este tema é documentación preliminar e está suxeito a cambios.]

Desde o estudio de deseño, pode editar o código do sitio mediante Visual Studio Code para a web. Esta función permítelle editar contido estático, HTML, CSS, Liquid e JavaScript para os seguintes metadatos do sitio web:

Metadatos	Contido
Formularios avanzados (formularios con varios pasos)	JavaScript
Formularios básicos	JavaScript
Fragmentos de contido	Todo o contido compatible con fragmentos de contido
Listas	JavaScript
Ficheiros web	Ver e descargar ficheiros multimedia. Editar ficheiros de texto (código).
Páxinas web	Todo o contido compatible (por idioma), JavaScript e CSS
Modelos web	Todos os contidos admitidos

Nota

Non poderás crear rexistros de metadatos, só engadir e editar contido, código e ver / descargar anexos de ficheiros.

Visual Studio Code para a web ofrece unha experiencia gratuíta e sen instalación de Microsoft Visual Studio Code que se executa enteiramente no seu explorador, o que lle permite explorar o código do sitio e facer cambios lixeiros no código de forma rápida e segura. Máis información: Experiencia de Visual Studio Code para a web.

Importante

• Esta é unha funcionalidade de vista previa.
• As funcionalidades de vista previa non se deseñaron para uso de produción e poden ter funcionalidade restrinxida. Estas funcionalidades están dispoñibles antes da versión oficial para que os clientes poidan obter acceso a elas rápido e fornecer comentarios.

Nota

• A primeira carga Visual Studio Code para a web pode levar algún tempo xa que se instalarán as extensións necesarias para esta función.
• Non se admiten as operacións de creación, eliminación e cambio de nome de ficheiros.
• Esta funcionalidade usa a extensión web de Power Platform Tools . As extensións web están restrinxidas polo sandbox do navegador e, polo tanto, teñen limitacións en comparación coas extensións normais.
  • A CLI de Power Platform non está soportada.
  • As funcións da extensión web Power Platform Tools están limitadas á experiencia de edición de código de Power Pages.
  • Esta función non está dispoñible en Government Community Cloud (GCC), Government Community Cloud (GCC High) e Department of Defense (DoD). Os usuarios destas rexións utilizarán a aplicación Xestión de portais para editar o código. Consulte Edición de código na aplicación Xestión de portais para obter máis información.

Editar código dispoñible no estudio de deseño

Podes comezar a editar o código do teu sitio usando Visual Studio Código para a web de Power Pages páxina de inicio seleccionando a opción Editar o código do sitio opción desde o Editar menú despregable.

Tamén podes editar código no estudo de deseño desde as seguintes áreas:

• Editar o código da páxina web desde o espazo de traballo de Pages
• Código do modelo de cabeceira do espazo de traballo de Pages
• Editar personalizado CSS código do espazo de traballo de estilos
• Edite código JavaScript personalizado para formularios con varios pasos
• Editar código JavaScript personalizado para formularios básicos
• Editar JavaScript personalizado para listas
• Editar fragmentos de contido
• Editar modelos web
• Ver e descargar ficheiros web multimedia (imaxes)
• Editar ficheiros web baseados en texto (CSS, JavaScript, outros)

Vexamos como editar código usando estas áreas.

Editar o código da páxina web desde a área de traballo de páxinas

Cando abra o estudio de deseño de Power Pages, verá a opción Editar código no menú Páxinas¹ e na esquina superior dereita da pantalla².

Código do modelo de cabeceira da área de traballo de páxinas

Seleccione Editar a cabeceira do sitio e, a seguir, seleccione Editar código para abrir o editor de código.

Editar o código de CSS personalizado da área de traballo de estilo

Vaia á área de traballo de estilo e seleccione o menú Editar código de CSS personalizado para abrir o editor de código.

Vista de accións de Power Pages

A vista Accións de Power Pages , accesible na parte inferior do Explorador de ficheiros, permítelle xestionar os sitios de Power Pages directamente dentro do editor. Reduce a necesidade de cambiar a Power Pages Studio permitindo aos desenvolvedores realizar tarefas comúns rapidamente desde o editor.

Accións dispoñibles

• Vista previa do sitio
  Esta acción limpa a caché de configuración e abre o sitio en VS Code. Permite aos desenvolvedores previsualizar e probar os cambios no código do sitio sen necesidade de cambiar o contexto a Power Pages Studio.

• Abrir en Power Pages Studio
  Despois de realizar cambios no código, use esta acción para ir a Power Pages Studio. Isto é útil para configurar provedores de autenticación, roles web e outras configuracións do sitio que non son editables no editor de código.

• Abrir no escritorio de VS Code
  Se VS Code Desktop está instalado, esta acción abre o sitio na aplicación de escritorio. Tamén desencadea unha descarga do sitio, asegurando que o código está dispoñible localmente e listo para a edición.

Combinar a notificación de conflitos

Se estás colaborando con outros desenvolvedores, pode haber situacións nas que traballarás no mesmo código fonte. No caso de que intente gardar os cambios nun ficheiro obsoleto, recibirá unha notificación para Comparar ou Sobrescribir os cambios.

Ao comparar o código, amosarase o código actual xunto co seu código e permitiralle volver aos cambios existentes, aceptar cada cambio individualmente ou usar os seus cambios e sobrescribir os contidos existentes.

Poderá revisar o contido máis recente e combinar ou sobrescribir o código ou descartar os cambios.

Titorial: Editar o código do sitio usando Visual Studio Code para a web

Neste titorial, pode editar o código do sitio usando Visual Studio Code para a web.

Paso 1: Editar o código do sitio usando Visual Studio Código para a Web

1. Abra o seu sitio no estudio de deseño de Power Pages

2. Na esquina superior dereita, seleccione Editar código

   

3. Seleccione Abrir Visual Studio Code desde o diálogo de confirmación.

4. Inicie sesión en Visual Studio Code coas súas credenciais do ambiente.

5. Agarde a que a extensión web Power Platform Tools se inicie e o código da páxina web se cargue no panel esquerdo.

Paso 2: Actualizar o contido e o código

1. O explorador da parte esquerda da pantalla carga os respectivos metadatos de configuración do sitio web que se poden editar mediante Visual Code para a web.

   

2. Faga cambios nos ficheiros de metadatos respectivos e prema Ctrl+S para gardar os cambios.

3. Vaia ao estudio de deseño e seleccione Sincronizar para sacar todas as actualizacións da súa sesión actual do estudio de deseño.

   

4. Seleccione Previsualizar para ver cambios no sitio de Power Pages.

Usando Visual Studio Código para a web ou Visual Studio Escritorio de código

Os usuarios poden editar, depurar e previsualizar os cambios nas edicións das páxinas mediante Visual Studio Code para a web sen necesidade de utilizar ferramentas externas. Visual Studio Code Desktop ofrece outras funcións avanzadas para editar todos os metadatos do sitio e integrarse con GitHub, marcos e procesos de integración continua/desenvolvemento continuo (CI/CD).

Funcionalidade	Código VS para a web	Escritorio VS Code
Crear novos rexistros de metadatos de configuración do sitio web	No	Limitado a páxinas web, modelos de páxinas, modelos web, fragmentos de contido e ficheiros web.
Edición directa do sitio	Si	No
Edición de metadatos do sitio	Limitado á edición de páxinas web, fragmentos de contido, formularios básicos, formularios con varios pasos, listas e modelos web.	Toda a configuración de metadatos de Power Pages
Previsualización do sitio	Planificado	Planificado
Power Platform CLI apoio	No	Si
Fluxo de traballo avanzado de CPU e almacenamento - ReactJS ou outra ferramenta de construción de frameworks	No	Si
Integración de GitHub con capacidades como o rexistro de código, a saída, a xestión de conflitos e a combinación.	No	Si

Edición de código na aplicación Xestión de portais

Nota

• O uso de Visual Studio Code para a web para editar sitios web non está soportado en Government Community Cloud (GCC), Government Community Cloud (GCC High) e Department of Defense (DoD). Os usuarios destas rexións poden utilizar a aplicación Xestión de portais para facer os seus cambios.

Se a rexión non admite o Visual Studio Code para a web, seleccionar a icona do editor de código </> na barra de comandos abrirá a aplicación Xestión de portais.

Navegue aos correspondentes rexistros de Páxinas web, Formularios básicos, Formularios con varios pasos, Listas ou Modelos web para editar código.

Tipo	Localización do código
páxina web	Seleccione o rexistro da páxina web. Seleccionar rexistro de contido da páxina web desde o contido localizado sección. O texto da páxina pódese editar no Copiar (HTML) campo no Xeral pestana. JavaScript personalizado e Personalizado CSS o código pódese editar desde o Avanzado pestana.
Formulario básico	Seleccione o rexistro básico do formulario. Edite JavaScript personalizado na pestana Configuración adicional .
Formulario con varios pasos	Seleccione o rexistro de formulario de varios pasos. Seleccione o paso do formulario en varios pasos na pestana Pasos do formulario . Edite JavaScript personalizado na pestana Opcións do formulario .
Lista	Seleccione o rexistro da lista. Editar JavaScript personalizado na pestana Opcións .
Modelo web	Seleccione o rexistro do modelo web. Editar a fonte na pestana Xeral .

Garde o rexistro e previsualice o seu sitio web para probar o seu código.

Consulte tamén

• Usar Visual Studio Código e Microsoft Power Platform CLI