Visual studio html редактор: Параметры, текстовый редактор, HTML (веб-формы), «Прочее» — Visual Studio (Windows)

«Параметры», «Текстовый редактор», «HTML (веб-формы)», «Проверка» — Visual Studio (Windows)

Twitter LinkedIn Facebook Адрес электронной почты

  • Статья
  • Чтение занимает 2 мин

Применимо к: Visual Studio Visual Studio для Mac Visual Studio Code

Чтобы настроить проверку синтаксиса HTML-разметки в редакторе для текущего файла, перейдите на страницу параметров Проверка. Чтобы открыть эту страницу, выберите в строке меню Инструменты>Параметры и перейдите к разделу Текстовый редактор>HTML (веб-формы)>Проверка.

Проверка

  • Использовать тип документа для определения схемы проверки

    Схема позволяет определить, какие элементы, атрибуты и регистр текста допустимы в выбранной схеме. Кроме того, вы можете определить теги и атрибуты, доступные в IntelliSense.

    Выберите этот параметр, если вы хотите, чтобы Visual Studio использовала содержимое страницы <! Объявление DOCTYPE> и html-элемент для определения схемы. Например, если вы выбрали этот параметр, а страница содержит объявление

    <!DOCTYPE html>, Visual Studio использует схему HTML5. Но если тег html имеет атрибут xmlns, такой как <html xmlns="http://www.w3.org/1999/xhtml">, в Visual Studio используется схема XHTML5.

  • Target when no doctype found (Выбрать целевую схему, если тип документа не найден)

    Выберите схему для проверки, если ее нет <! Объявление DOCTYPE> на странице.

    • Показать ошибки

      Установите этот флажок, чтобы включить проверку. Если флажок снят, редактор не будет выделять ошибки при проверке.

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

      Примечание

      Некоторые схемы не предоставляют параметры для пометки отдельных типов ошибок. Например, при выборе XHTML 1.1 в качестве схемы целевого объекта все флажки параметров будут сняты. В этом случае выделяются все типы ошибок.

См. также

  • Страница «Общие», папка «Среда», диалоговое окно «Параметры»

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

Twitter LinkedIn Facebook Адрес электронной почты

  • Статья
  • Чтение занимает 3 мин

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

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

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

Внимание

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

Заметка

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

Функция редактирования кода позволит пользователям редактировать код в следующих областях:

  • Редактирование кода веб-страницы из рабочей области страниц
  • Код шаблона заголовка из рабочей области страниц
  • Редактирование кода пользовательской таблицы CSS из рабочей области стиля

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

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

Когда вы откроете студию дизайна Power Pages, вы увидите параметр Изменить код в меню страниц1 и в правом верхнем углу экрана2.

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

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

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

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

Учебное пособие: редактирование кода сайта с помощью веб-версии Visual Studio Code

В этом руководстве вы пошагово отредактируете код сайта, используя веб-версию Visual Studio Code.

Шаг 1. Отредактируйте код сайта, используя Visual Studio Code

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

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

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

  4. Войдите в Visual Studio Code, используя ваши учетные данные среды.

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

Шаг 2. Обновление кода веб-страницы

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

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

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

  4. Выберите Предварительный просмотр, чтобы увидеть изменения на сайте Power Pages.

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

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

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

Использование редактора кода

Заметка

  • Использование веб-версии Visual Studio Code для редактирования веб-сайтов не поддерживается в правительственном облаке сообщества (GCC), правительственном облаке сообщества High (GCC High) и министерстве обороны (DoD). Пользователи в этих регионах будут использовать редактор кода в студии дизайна для внесения своих изменений.
  • Регионы, поддерживающие редактор Visual Studio Code, не увидят редактор кода студии дизайна.

Чтобы просмотреть исходный код страницы на холсте, выберите значок редактора кода </> на панели команд.

Исходный код отображается в панели «Редактор кода» в нижней части экрана. Любые ранее внесенные вами изменения отражаются в исходном коде. Чтобы внести изменения, обновите исходный код и выберите Сохранить. Изменения отразятся на холсте.

Редактор кода поддерживает три варианта закрепления: внизу, справа или на полноэкранный режим правки.

Холст редактора кода поддерживает редактирование HTML. Для редактирования JavaScript или пользовательского CSS выберите Редактировать CSS и JS. Вы перейдете к приложению для управления порталом. Там выберите вкладку Дополнительно, чтобы внести любые изменения, которые вы хотите в JavaScript и разделы CSS.

См. также

  • Использование Visual Studio Code и интерфейса командной строки Microsoft Power Platform

asp.net — Есть ли редактор HTML wysiwyg?

спросил

Изменено 10 лет, 1 месяц назад

Просмотрено 2к раз

Интересно, есть ли хороший редактор WYSIWYG, когда дело доходит до редактирования сложных HTML-страниц, созданных с помощью ASP. NET, PHP, GWT или чего-то еще. Я перепробовал множество инструментов WYSIWYG, но в какой-то момент мне всегда приходилось вручную редактировать исходный код HTML или CSS, чтобы исправить различные проблемы. Редакторы, которые я пробовал, никогда не были совместимы с кодом ASP.NET/PHP/etc, который я пишу.

Изменить : я несколько лет использовал Visual Studio для разработки ASP.NET. Через некоторое время всегда доходит до того, что я даже не могу открыть страницы и пользовательские элементы управления, потому что они зависят от очень многих вещей, недоступных во время отладки.

  • asp.net
  • HTML
  • wysiwyg

5

Вы не получите ничего идеального. Вам почти всегда придется немного подправить разметку вручную.

Лучшим выбором, вероятно, будет Adobe Dreamweaver для PHP и Visual Studio (Visual Studio Web Developer Express бесплатен) для ASP.NET.

1

Я люблю VS, но лучше займусь любовью с ежиком, чем буду пользоваться HTML-редактором. Expression Web гораздо лучше справляется с редактированием HTML.

1

Лично я считаю, что Visual Studio лучше всего подходит для ASP.NET, хотя Expression Web также кажется довольно хорошим.

Но лично я считаю, что для вас будет лучше начать писать больше кода и все меньше и меньше использовать часть WYSIWYG. В веб-приложениях все зависит от того, как они отображаются в браузере, и я думаю, что браузер — это инструмент, который следует использовать для тестирования графического интерфейса.

Согласен, сейчас у меня есть Expression Web, и он работает хорошо. Вы можете перемещать элементы в представлении «Дизайн», но, конечно, как указано выше, вам придется отображать код вручную. Но это работает, если вы хотите увидеть изменения, которые вы внесли. Я всегда, конечно, просматривал бы его в браузере, а не просто полагался бы на представление дизайна. Также W3Schools — отличный инструмент.

WYSIWYG-редакторы для сложных веб-сайтов/приложений никогда не сравнимы с IMHO .

Проблема сводится к желанию контролировать разметку HTML/CSS, а также гибкости для создания графического интерфейса с помощью перетаскивания. (эти 2 почти противоположны)

Возьмем очень простой пример .

В режиме WYSIWYG я набираю/создаю (представляю, что World находится в строке сразу после Hello (редактор Markdown заставляет меня добавить дополнительный разрыв строки)):

Привет

Мир

Какой HTML должен создавать редактор?

 Здравствуйте
Мир

Здравствуйте

Мир

Здравствуйте
Мир
Здравствуйте
Мир

(и множество других возможностей)

Я по-прежнему считаю, что лучшее, что у вас может быть, — это редактор/IDE, который понимает ваши компоненты/теги и обеспечивает автозаполнение и поддержку кода/intellisense — в сочетании с очень быстрым развертыванием возможность протестировать изменения как можно скорее в реальном(их) браузере(ах)

Взгляните на редактор BBCode

http://richtexteditor. com/demo/bbcode.aspx

В этом примере показан простой модуль форматирования BBCode для редактора.

Зарегистрируйтесь или войдите в систему

Зарегистрируйтесь с помощью Google

Зарегистрироваться через Facebook

Зарегистрируйтесь, используя электронную почту и пароль

Опубликовать как гость

Электронная почта

Требуется, но не отображается

Опубликовать как гость

Электронная почта

Требуется, но не отображается

c# — HTML-редактор Visual Studio 2022 Custom Intellisense — IHtmlCompletionListProvider

Мы пытаемся перенести расширение Visual Studio 2019 в Visual Studio 2022. Расширение предоставляет несколько функций, но одна функция, которая не работает, — «HtmlCompletionProvider». Мы используем его для предоставления пользовательских элементов и атрибутов в редакторе HTML в VS2019.

Так определяются наши классы завершения.

 [HtmlCompletionProvider ("Дети", "*")]
 [ТипСодержимого("htmlx")]
 [Имя("DurandalElementsCompletionProvider")]
 открытый класс DurandalElementsCompletionProvider: IHtmlCompletionListProvider
 

Интерфейс определен в сборке Microsoft.WebTools.Languages.Html.Editor.

Этот интерфейс позволяет нам подключаться к существующему VS2019 intellisense и предоставлять дополнительные записи.

Как правильно это сделать в Visual Studio 2022? Нет никакой документации, которую мы могли бы найти, просто погуглив.

Ближе всего мы подошли к объяснению, что новая Visual Studio использует LanguageService, определенный в: C:\Program Files\Microsoft Visual Studio\2022\Enterprise\Common7\IDE\Extensions\Microsoft\Web Tools\Languages\LanguageServers\Microsoft. WebTools.Languages.LanguageServer.Server.dll

Мы предполагаем, что старый способ предоставления «HtmlCompletionProvider» не поддерживается в VS2022.

Angular использует IHtmlCompletionListProvider для своего расширения.

Angular Language Service for Visual Studio   

Пример кода, как они используют IHTMLCompletionListProvider

https://github.com/microsoft/vs-ng -language-service/blob/main/AngularLanguageService/AngularHtmlCompletionProvider.cs

Они в основном используют его в качестве прокси для вызова своего LanguageService.

Насколько мне известно, нет расширения Angular для VS2022 (чтобы мы могли посмотреть, как это делается).

С уважением, Горан Вукоя

  • c#
  • visual-studio
  • intellisense
  • vsix
  • visual-studio-2022

Мы решили эту проблему.

Мы декомпилировали Microsoft.WebTools.Languages.Html.Editor.dll, чтобы увидеть, как определяется HTMLCompletionListProvider по умолчанию.

Оставить комментарий

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *