Редактирайте кода с Visual Studio Code for the Web (предварителен преглед)

[Тази тема е предварителна документация и подлежи на промяна.]

От дизайнерското студио можете да редактирате сайт с Visual Studio Code за уеб. Тази функция ви позволява да редактирате статично съдържание, HTML, CSS, Liquid и JavaScript за следните метаданни на уеб сайт:

Метаданни	Съдържание
Усъвършенствани формуляри (многостъпкови формуляри)	JavaScript
Основни форми	JavaScript
Фрагменти от съдържание	Съдържание на фрагмент от цялото поддържано съдържание
Списъци	JavaScript
Уеб файлове	Преглеждане и изтегляне на мултимедийни файлове. Редактиране на файлове с текст (код).
Уеб страници	Цялото поддържано съдържание (на език), JavaScript и CSS
Уеб шаблони	Цялото поддържано съдържание

Бележка

Няма да можете да създавате записи на метаданни, а само да добавяте и редактирате съдържание, код и преглеждате/изтегляте прикачени файлове.

Visual Studio Code for the Web предоставя безплатно изживяване с нулева инсталация на Microsoft Visual Studio Code, работещо изцяло във вашия браузър, позволявайки ви бързо и безопасно да разглеждате кода на сайта и да правите леки промени в кода. Повече информация: Visual Studio Code за уеб изживяването.

Важно

• Това е функция за предварителен преглед.
• Функциите за предварителен преглед не са предназначени за производствена употреба и може да са с ограничена функционалност. Тези функции са достъпни преди официалното издание, за да могат клиентите да получат ранен достъп и да дадат обратна връзка.

Бележка

• Първият път Visual Studio Code за уеб натоварване може да отнеме време, тъй като ще се инсталират необходимите разширения за тази функция.
• Операциите за създаване на файлове, изтриване и преименуване не се поддържат.
• Тази функция използва уеб разширение Power Platform Tools . Уеб разширенията са ограничени от пясъчника на браузъра и следователно имат ограничения в сравнение с нормалните разширения.
  • Power Platform CLI не се поддържа.
  • Уеб разширенията на Power Platform Tools са ограничени до опита при редактиране на кода в Power Pages.
  • Тази функция не е налична в облака на правителствената общност (GCC), облака на правителствената общност (GCC High) и Министерството на отбраната (DoD). Потребителите в тези региони ще използват приложението за управление на портали за редактиране на код. Вижте Редактиране на код в приложението за управление на портали за повече информация.

Редактиране на код, наличен в студиото за дизайн

Можете да започнете да редактирате кода на сайта си с Visual Studio Code за уеб от началната страница на Power Pages, като изберете опцията Редактирай код на сайта от падащото меню Edit.

Можете също така да редактирате код в дизайнерското студио от следните области:

• Редактиране на кода на уеб страница от работното пространство на Pages
• Код на шаблон за заглавка от работното пространство на Pages
• Редактиране на персонализиран CSS код от работното пространство за стилизиране
• Редактиране на персонализиран JavaScript код за многостъпкови формуляри
• Редактиране на персонализиран JavaScript код за основни формуляри
• Редактиране на персонализиран JavaScript за списъци
• Редактиране на фрагменти на съдържание
• Редактиране на уеб шаблони
• Преглеждане и изтегляне на мултимедийни уеб файлове (изображения)
• Редактиране на текстови уеб файлове (CSS, JavaScript, други)

Нека да разгледаме как се редактира код с помощта на тези области.

Редактиране на код на уеб страница от работната област за страници

Когато отвориш Power Pages design studio, виждаш опцията Edit code в менюто Pages¹ и в горния десен ъгъл на екрана².

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

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

Изберете Редактиране на горен колонтитул на сайт и след това изберете Редактиране на код, за да отворите редактора на код.

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

Редактиране на персонализиран CSS код от работната област за стилизиране

Отидете на Работна област за стилизиране и изберете менюто за налично персонализирано CSS Редактиране на код , за да отворите редактора на код.

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

Power Pages Actions изглед

Изгледът Power Pages Actions, достъпен в долната част на File Explorer, ви позволява да управлявате Power Pages сайтове директно в редактора. Това намалява нуждата от преминаване към Power Pages design studio, като позволява на разработчиците да изпълняват често срещани задачи бързо от редактора.

Налични действия

• Преглед на сайта
  Това действие изчиства конфигурационния кеш и отваря сайта във VS Code. Той позволява на разработчиците да преглеждат и тестват промените в кода на сайта, без да се налага да превключват контекста към Power Pages design studio.

• Open in Power Pages design studio
  След като направите промени в кода, използвайте това действие, за да отидете в Power Pages design studio. Това е полезно за конфигуриране на доставчици на удостоверяване, уеб роли и други настройки на сайта, които не могат да се редактират в редактора на код.

• Отваряне във VS Code Desktop
  Ако е инсталиран VS Code Desktop, това действие отваря сайта в настолното приложение. Той също така задейства изтегляне на сайта, като гарантира, че кодът е достъпен локално и готов за редактиране.

Известие за конфликт на обединяване

Ако си сътрудничите с други разработчици, може да има ситуации, в които ще работите върху същия изходен код. В случай че се опитате да запазите промени в остарял файл, ще получите известие за Сравняване или Презаписване на промените.

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

Конфликти при обединяване в кода.

Ще можете да прегледате най-новото съдържание и да обедините или презапишете кода или да отхвърлите промените.

Урок: Редактиране на код на сайта с помощта на Visual Studio Code for the Web

В този урок преминавате през редактирането на кода на сайта с помощта на Visual Studio Code for Web.

Стъпка 1: Редактиране на кода на сайта с помощта на Visual Studio Code for the Web

1. Отворете сайта си в Power Pages design studio

2. В горния десен ъгъл изберете Редактиране на кода

   

3. Изберете Open Visual Studio Code от диалога за потвърждение.

4. Влезте във Visual Studio Code, използвайки данните за вашата среда.

5. Изчакайте уеб разширението Power Platform Tools да се инициализира и кодът на уеб страницата да се зареди в левия панел.

Стъпка 2: Актуализиране на съдържание и код

1. Прозорецът от лявата страна на екрана зарежда съответните метаданни за конфигурация на уеб сайта, които могат да бъдат редактирани с помощта на Visual Code for the Web.

   Меню на прозореца за работна област без име, показващо уеб файлове.

2. Въведете промени в съответните файлове с метаданни и натиснете Ctrl+S, за да запазите промените.

3. Отидете в студиото за дизайн и изберете Синхронизиране за да изтеглите всички актуализации в текущата си сесия на студиото за дизайн.

   

4. Изберете Preview, за да видите промените на сайта на Power Pages.

Използване на Visual Studio Code за уеб или Visual Studio Code Desktop

Потребителите могат да редактират, отстраняват грешки и преглеждат промените в редакции на страници с помощта на Visual Studio Code for the Web без нужда от външни инструменти. Visual Studio Code Desktop предоставя и други напреднали функции за редактиране на всички метаданни на сайта и интеграция с GitHub, рамки и процеси за непрекъсната интеграция/непрекъсната разработка (CI/CD).

Характеристика	VS код за уеб	VS Код работен плот
Създаване на нови записи с метаданни за конфигурация на уеб сайт	No	Ограничено до уеб страници, шаблони за страници, уеб шаблони, фрагменти на съдържание и уеб файлове.
Директно редактиране на сайт	Да	No
Редактиране на метаданни на сайт	Ограничено до редактиране на уеб страници, фрагменти от съдържание, основни формуляри, многостъпкови формуляри, списъци и уеб шаблони.	Конфигурация на метаданните на All Power Pages
Преглед на сайт	Планирано	Планирано
Power Platform Поддръжка на CLI	No	Да
Разширен работен процес, обвързан с процесор и съхранение - ReactJS или друга поддръжка на инструмент за изграждане на рамка	No	Да
GitHub интеграция с възможности като check-in, check-out, управление на конфликти и сливане.	No	Да

Редактиране на код в приложението за управление на портали

Бележка

• Използването на Visual Studio Code for the Web за редактиране на уебсайтове не се поддържа в Government Community Cloud (GCC), Government Community Cloud (GCC High) и Министерството на отбраната (DoD). Потребителите в тези региони могат да използват приложението Portal Management, за да направят своите промени.

Ако регионът не поддържа Visual Studio Code за уеб, избирането на иконата на редактора на код </> в командната лента ще отвори приложението Portal Management приложение.

Отидете до съответните записи на уеб страници, основни формуляри, многостъпкови формуляри, списъци или уеб шаблони, за да редактирате код.

Тип	Местоположение на код
Уеб страница	Изберете запис на уеб страница. Изберете запис на съдържание на уеб страница от секцията Локализирано съдържание . Копието на страницата може да се редактира в полето Копиране (HTML) в раздела Общи .Персонализиран JavaScript и персонализиран код могат да се редактират от раздела CSS Разширени .
Основен формуляр	Изберете основния запис на формуляра. Редактирайте персонализиран JavaScript в раздела Допълнителни настройки .
Многостъпков формуляр	Изберете многоетапния запис на формуляра.Изберете многостъпковата стъпка на формуляр от раздела Стъпки на формуляра . Редактирайте персонализиран JavaScript в раздела Опции на формуляра .
Списък	Изберете записа на списъка. Редактирайте персонализиран JavaScript в раздела Опции .
Уеб шаблон	Изберете записа на уеб шаблона. Редактиране на източника в раздела Общи .

Запазете записа и прегледайте уеб сайта си, за да тествате кода си.

Вижте също

• Използвайте Visual Studio Code и Microsoft Power Platform CLI