Изменение кода с помощью Visual Studio Code для Интернета (предварительная версия)

[Данный раздел посвящен предварительному выпуску и может быть изменен.]

В студии разработки можно изменить код сайта с помощью Visual Studio Code для Веб. Эта функция позволяет редактировать статическое содержимое, код HTML, CSS,Liquid и JavaScript для следующих метаданных веб-сайта:

Метаданные	Контент
Расширенные формы (многошаговые формы)	JavaScript
Базовые формы	JavaScript
Фрагменты содержимого	Все поддерживаемые фрагменты содержимого
Списки	JavaScript
Веб-файлы	Просмотр и загрузка медиафайлов. Редактирование текстовых файлов (файлов кода).
Веб-страницы	Все поддерживаемое содержимое (для каждого языка), JavaScript и CSS
Веб-шаблоны	Все поддерживаемое содержимое

Заметка

Вы не сможете создавать записи метаданных, добавлять и изменять только содержимое, код и просмотр и скачивание вложений файлов.

Visual Studio Code для Интернета предоставляет бесплатную версию Microsoft Visual Studio Code, не требующую установки и полностью работающую в вашем браузере, что позволяет изучать исходный код сайтов и быстро и безопасно вносить небольшие изменения в код. Дополнительные сведения: Visual Studio Code для веб-интерфейса.

Важно

• Это предварительная версия функции.
• Предварительные версии функций не предназначены для использования в производственной среде, а их функциональность может быть ограничена. Они доступны перед официальным выпуском, чтобы клиенты могли досрочно получить доступ и предоставить отзывы.

Demo использования Visual Studio Code в вебе для редактирования сайта Power Pages.

Заметка

• При первом использовании загрузка Visual Studio Code for Web может занять некоторое время, так как устанавливаются необходимые для этой функции расширения.
• Операции создания, удаления и переименования файлов не поддерживаются.
• Эта функция использует веб-расширение Power Platform Tools . Веб-расширения ограничены песочницей браузера и поэтому имеют ограничения по сравнению с обычными расширениями.
  • Интерфейс командной строки Power Platform не поддерживается.
  • Функции веб-расширения Power Platform Tools ограничены опытом редактирования кода в Power Pages.
  • Эта функция недоступна в облаке сообщества государственных организаций (GCC), облаке сообщества государственных организаций (GCC High) и Министерстве обороны (DoD). Пользователи в этих регионах будут использовать приложение Управление порталами для редактирования кода. Дополнительную информацию см. в разделе Редактирование кода в приложении "Управление порталами".

Редактирование кода доступно в дизайн-студии

Вы можете начать редактирование кода вашего сайта с помощью Visual Studio Code в веб-режиме с домашней страницы Power Pages, выбрав Редактировать код сайта из раскрывающегося меню Редактировать.

Вы также можете отредактировать код в студии дизайна из следующих областей:

• Редактирование кода веб-страницы из рабочей области "Страницы"
• Код шаблона заголовка из рабочей области "Страницы"
• Редактирование пользовательского кода CSS из рабочей области "Настройка стиля"
• Редактировать пользовательский код JavaScript для многошаговых форм
• Редактировать пользовательский код JavaScript для базовых форм
• Редактирование пользовательского кода JavaScript для списков
• Редактирование фрагментов содержимого
• Изменение веб-шаблонов
• Просмотр и загрузка веб-медиафайлов (изображений)
• Изменение текстовых веб-файлов (CSS, JavaScript, других)

Давайте посмотрим, как редактировать код, используя эти области.

Редактирование кода веб-страницы из рабочей области страниц

При открытии студии разработки Power Pages, вы увидите параметр Редактировать код в меню Pages¹ и в правом верхнем углу экрана².

Редактирование кода из рабочей области страниц.

Код шаблона заголовка из рабочей области страниц

Выберите Редактировать заголовок сайта, затем выберите Редактировать код, чтобы открыть редактор кода.

Редактирование кода из заголовка страниц.

Редактирование пользовательского кода CSS из рабочей области "Настройка стиля"

Перейдите в рабочую область "Настройка стиля" и выберите пункт меню Редактировать код, доступный для пользовательского кода CSS, чтобы открыть редактор кода.

Редактирование кода из пользовательского кода CSS.

Обзор действий Power Pages

Представление Действия Power Pages, доступное в нижней части проводника, позволяет управлять сайтами Power Pages непосредственно в редакторе. Это сокращает необходимость переключения на студию дизайна Power Pages, позволяя разработчикам быстро выполнять распространенные задачи, не выходя из редактора.

Доступные действия

• Предварительный просмотр сайта
  Это действие очищает кэш конфигурации и открывает сайт в VS Code. Это позволяет разработчикам предварительно просматривать и тестировать изменения кода сайта без необходимости переключения контекста на студию разработки Power Pages.

• Открыть в студии дизайна Power Pages
  После внесения изменений в код используйте это действие, чтобы перейти в дизайнерскую студию Power Pages. Это полезно для настройки поставщиков проверки подлинности, веб-ролей и других параметров сайта, которые не редактируются в редакторе кода.

• Открытие в VS Code Desktop
  Если установлен рабочий стол VS Code, это действие открывает сайт в классическом приложении. Он также активирует скачивание сайта, гарантируя, что код доступен локально и готов к редактированию.

Уведомление о конфликте слияния

Если вы сотрудничаете с другими разработчиками, могут возникнуть ситуации, когда вы будете работать над тем же исходным кодом. Если вы попытаетесь сохранить изменения в устаревшем файле, вы получите уведомление о необходимости Сравнить или Перезаписать изменения.

Сравнение кода покажет текущий код рядом с вашим кодом и позволит вам вернуться к существующим изменениям, принять каждое изменение по отдельности или использовать свои изменения и перезаписать существующее содержимое.

Выполните слияние конфликтов в коде.

Вы сможете просмотреть последнее содержимое и либо объединить, либо перезаписать код, либо отменить изменения.

Руководство. Изменение кода сайта с помощью Visual Studio Code для Интернета

В этом руководстве описано, как изменить код сайта с помощью Visual Studio Code для Интернета.

Шаг 1. Изменение кода сайта с помощью Visual Studio Code для Интернета

1. Откройте сайт в студии разработки Power Pages

2. В правом верхнем углу нажмите кнопку "Изменить код"

   

3. Выберите Open Visual Studio Code в диалоговом окне подтверждения.

4. Войдите в Visual Studio Code с помощью учетных данных сред.

5. Дождитесь инициализации веб-расширения Power Platform Tools и загрузки кода веб-страницы на левой панели.

Шаг 2. Обновление содержимого и кода

1. Проводник в левой части экрана загружает соответствующие метаданные конфигурации веб-сайта, которые можно редактировать с помощью Visual Code для Интернета.

   Меню проводника для рабочей области без названия, показывающее веб-файлы.

2. Внесите изменения в соответствующие файлы метаданных и нажмите Ctrl+S, чтобы сохранить изменения.

3. Перейти в студию дизайна и выберите Синхронизировать, чтобы получить все обновления в текущем сеансе студии дизайна.

   

4. Выберите Preview, чтобы просмотреть изменения на сайте Power Pages.

Использование Visual Studio Code for the Web или Visual Studio Code Desktop

Пользователи могут изменять, отлаживать и просматривать изменения страниц с помощью Visual Studio Code для Интернета без использования внешних средств. Visual Studio Code Desktop предоставляет другие расширенные функции для редактирования всех метаданных сайта и интеграции с GitHub, платформами и процессами непрерывной интеграции и непрерывной разработки (CI/CD).

Функция	VS Code в Интернете	VS Code на настольном компьютере
Создание новых записей метаданных конфигурации веб-сайта	нет	Ограничено веб-страницами, шаблонами страниц, веб-шаблонами, фрагментами содержимого и веб-файлами.
Прямое редактирование сайта	Да	нет
Редактирование метаданных сайта	Ограничено редактированием веб-страниц, фрагментов содержимого, базовых форм, многошаговых форм, списков и веб-шаблонов.	Все настройки метаданных Power Pages
Предварительный просмотр сайта	Плановое	Плановое
Поддержка интерфейса командной строки Power Platform	нет	Да
Расширенный рабочий процесс, привязанный к ЦП и хранилищу. Поддержка ReactJS или другого средства сборки платформы	нет	Да
Интеграция с GitHub с такими возможностями, как возврат кода, получение кода, управление конфликтами и слияние.	нет	Да

Редактирование кода в приложении "Управление порталами"

Заметка

• Использование Visual Studio Code для редактирования веб-сайтов не поддерживается в Облаке Сообщества Государственных Учреждений (GCC), Облаке Сообщества Государственных Учреждений (GCC High) и Министерстве обороны США (МО США). Пользователи в этих регионах могут использовать приложение "Управление порталом" для внесения изменений.

Если регион не поддерживает Visual Studio Code для веба, выбор значка редактора кода <> в командной строке откроет приложение Управление Порталом.

Переходите к соответствующим записям веб-страниц, базовых форм, многошаговых форм, списков или веб-шаблонов, чтобы редактировать код.

Тип	Местоположение кода
Веб-страница	Выберите запись веб-страницы. Выберите запись содержимого веб-страницы в разделе Локализованное содержимое. Текст страницы можно редактировать в поле Текст (HTML) на вкладке Общие.Пользовательский код JavaScript и Пользовательский код CSS можно редактировать на вкладке Дополнительно.
Базовая форма	Выберите запись базовой формы. Измените настраиваемый JavaScript на вкладке "Дополнительные параметры".
Многошаговая форма	Выберите многоэтапную запись формы.На вкладке "Шаги формы " выберите шаг формы с несколькими шагами. Измените настраиваемый JavaScript на вкладке "Параметры формы ".
Список (List)	Выберите запись списка. Изменение пользовательского JavaScript на вкладке "Параметры".
Веб-шаблон	Выберите запись веб-шаблона. Измените источник на вкладке "Общие ".

Сохраните запись и просмотрите свой веб-сайт, чтобы протестировать отредактированный код.

См. также

• Используйте Visual Studio Code и Microsoft Power Platform CLI