C✳CODEZ.WIN
🌐 Русский

Локализованное руководство по чтению

ui-widget-developerНазначение, использование и источник

Создавайте MCP-серверы для Copilot Chat, используя поддержку рендеринга виджетов OpenAI Apps SDK или MCP Apps SDK (на любом языке). Этот навык пригодится, когда: - Создаются MCP-серверы, интегрирующиеся с M365Декларативные агенты Copilot — Создание многофункциональных интерактивных виджетов (React + Fluent UI), отображаемых в чате Copilot — Внедрение инструментов, возвращающих структурированный контент для рендеринга виджетов — Адаптация существующего сервера MCP для поддержки рендеринга виджетов Copilot — Настройка туннелей разработки для доступа к локальному серверу MCP — КонфигурированиеmcpPlugin.jsВ манифестах с использованием среды выполнения RemoteMCPServer НЕ используйте этот навык для общей разработки агентов (генерация кода, манифесты, развертывание) — используйте вместо него declarative-agent-developer. Этот навык предназначен ТОЛЬКО для разработки MCP-сервера + виджета. Триггеры: "MCP-сервер для Copilot", "OpenAI Apps SDK", "виджет Copilot", "structuredContent", "плагин MCP", "devtunnels MCP", "приложение OAI", "рендеринг виджета", "виджет пользовательского интерфейса"

Источник получен:

Репозиторий-источник
microsoft/skills
SKILL.md
.github/plugins/microsoft-365-agents-toolkit/skills/ui-widget-developer/SKILL.md
Звёзды репозитория
3,157
Последнее обновление репозитория
2026-10-31
Категории Skills
Рабочий процесс агента
Время последнего сбора

Лицензия: MIT

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

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

Что делает этот навык

Создавайте MCP-серверы для Copilot Chat, используя поддержку рендеринга виджетов OpenAI Apps SDK или MCP Apps SDK (на любом языке). Этот навык пригодится, когда: - Создаются MCP-серверы, интегрирующиеся с M365Декларативные агенты Copilot — Создание многофункциональных интерактивных виджетов (React + Fluent UI), отображаемых в чате Copilot — Внедрение инструментов, возвращающих структурированный контент для рендеринга виджетов — Адаптация существующего сервера MCP для поддержки рендеринга виджетов Copilot — Настройка туннелей разработки для доступа к локальному серверу MCP — КонфигурированиеmcpPlugin.jsВ манифестах с использованием среды выполнения RemoteMCPServer НЕ используйте этот навык для общей разработки агентов (генерация кода, манифесты, развертывание) — используйте вместо него declarative-agent-developer. Этот навык предназначен ТОЛЬКО для разработки MCP-сервера + виджета. Триггеры: "MCP-сервер для Copilot", "OpenAI Apps SDK", "виджет Copilot", "structuredContent", "плагин MCP", "devtunnels MCP", "приложение OAI", "рендеринг виджета", "виджет пользовательского интерфейса"

Как работает рабочий процесс на вышестоящем уровне

Быстрый старт

Терминал1- Запуск сервера MCP: Терминал2- Запуск DevTunnel: При первом запуске выполните инициализацию агента после установления туннеля (см. правило ИНИЦИАЛИЗАЦИИ АГЕНТА). При последующих запусках URL-адрес туннеля остается стабильным — повторная инициализация не требуется, если только не произойдут изменения в манифесте агента.

проход вверх по течению · L384 ↗

Рабочий процесс разработки

Запуск сервера MCP (режим разработки с горячей перезагрузкой): TypeScript:cd mcp-server && npm install && npm run devPython:cd mcp-server && pip install -r requirements.txt && python server.pyC#:cd mcp-server && dotnet run

проход вверх по течению · L402 ↗

🚨 ПРАВИЛА КРИТИЧЕСКОГО ВЫПОЛНЕНИЯ 🚨

ОБЯЗАТЕЛЬНОЕ ИСПОЛЬЗОВАНИЕ FLUENT UI: Реализации виджетов ДОЛЖНЫ использовать React + компоненты Fluent UI. Перед написанием любого кода виджета агент ДОЛЖЕН прочитать и следовать следующим инструкциям:references/best-practices.mdТРЕБОВАНИЯ К ПАКЕТАМ FLUENT UI (ОБЯЗАТЕЛЬНО): Проект виджета ДОЛЖЕН включать зависимости Fluent UI до начала реализации. Как минимум, установите и сохраните их в зависимостях пакета виджета: Если какой-либо из этих пакетов отсутствует, установите его автоматически перед продолжением генерации кода виджета. Если сгенерированный виджет не включает файлы входа React (например)widgets/src//main.tsxи файл компонента React) и импорт Fluent из@fluentui/react-componentsЗадача не выполнена и ДОЛЖНА быть исправлена ​​перед возвратом результатов.

проход вверх по течению · L95 ↗

Требования и настройка

Настройка DevTunnels

> Только для локального тестирования. DevTunnels предназначены для разработки и тестирования на вашем компьютере. Прежде чем предоставлять агенту более широкий доступ, разверните сервер MCP и ресурсы виджетов в размещенной среде (например, Azure App Service, Azure Static Web Apps или у другого хостинг-провайдера) и обновите URL-адреса манифеста агента соответствующим образом. DevTunnels предоставляют доступ к вашему локальному серверу MCP для M.365Copilot использует именованные туннели для стабильных URL-адресов. См.references/devtunnels.mdдля скриптов настройки, справочника команд и устранения неполадок.

проход вверх по течению · L372 ↗

Ограничения и проверки качества

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

Начните с безопасного пробного периода.

  1. Проверьте поддерживаемый хост и инструкции по установке репозитория. Храните каталог Skill, а также связанные с ним скрипты, ресурсы и документацию вместе;SKILL.mdВ одиночку можно опустить зависимости.
  2. Предоставьте агенту ваши реальные входные данные, желаемый результат и критерии приемки. Синтаксис вызова и доступные инструменты зависят от хоста; данный сайт не предполагает универсальной команды установки.
  3. Попробуйте запустить исходный рабочий процесс в тестовом проекте или в его копии. Перед тем как разрешить операции, изменяющие файлы, удаленные сервисы или оплачиваемые ресурсы, проверьте их.
  4. Проверьте выходные данные на соответствие исходным проверкам качества и вашим собственным требованиям. Успешный запуск или большое количество звезд в репозитории не гарантируют корректного результата.

Формат навыков и спецификация каталога ↗

Подробнее читайте в источнике.

Перевод и сфера применения

В этом руководстве по чтению представлены избранные отрывки из закрепленного текста выше по течению.SKILL.mdПеревод выполнен с помощью переводчика. Это не полное руководство и не гарантия проверенной совместимости. Перед использованием ознакомьтесь с оригиналом и указанными в нем файлами.

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

Закрепленный источник
Прочитайте оригинал ↗
Источник получен
Исходный коммит
00d66a64919edca5bca2c673373444e36a4b5461
Исходный SHA-256
b24d0babae9e85054d30765abca0043a2c310ba7dc980d1da258c39b87f8cd12
Вернуться к полному каталогу навыков