Перейти к руководству
Baoyu Markdown to HTMLавтор jimliu

Baoyu Markdown to HTML Навык.

Преобразуйте Markdown в оформленный HTML для публикации статей.

  • Markdown
  • Оформление статей
Обзор исходных материалов · baoyu-markdown-to-htmlSKILL.md
Задача Преобразуйте Markdown в оформленный HTML для публикации статей. Результаты HTML-файл с выбранной темой и стилями CSS в атрибутах элементов. Перед началом Навык создаёт HTML; публикация статьи — отдельное действие.
Редакционное описание · исходные материалы проверены 2026-11-02 · не сгенерированный пример

01 Возможности

Преобразуйте Markdown в оформленный HTML для публикации статей

Преобразуйте Markdown в HTML с темой и встроенными стилями, кодом, диаграммами и необязательными сносками для внешних ссылок в статьях WeChat.

Процесс на основе источникаНе тест выполнения

Принцип работы

Baoyu Markdown to HTML преобразует статью в оформленный HTML со стилями CSS в атрибутах элементов и оптимизирован для процессов WeChat Official Account. Поддерживаются выбор темы и типографики, подсветка кода, сноски, блоки уведомлений и диаграммы. Готовый HTML сохраняется рядом с Markdown-источником; для существующего HTML создаётся резервная копия с отметкой времени.

Навык также обрабатывает детали публикации, влияющие на готовую статью. Первый заголовок по умолчанию удаляется, если не включён keep-title, а внешние ссылки превращаются в сноски внизу только по явному запросу. Диаграммы Mermaid отрисовываются браузером в PNG и кешируются; если отрисовка недоступна, используется текстовый вариант.

Ожидаемые результаты

  • HTML-файл с выбранной темой и стилями CSS в атрибутах элементов.
  • Сведения о созданных или упомянутых изображениях, включая PNG Mermaid при успешной отрисовке.
  • Структурированный результат с путём HTML и, при наличии, путём резервной копии.
Смотреть пример задания

От задания до проверки

  1. 01
    Определите оформление статьи

    Прочитайте явно заданную тему и настройки EXTEND.md. Если входной текст содержит символы CJK и доступен baoyu-format-markdown, предложите отдельный шаг форматирования перед преобразованием.

  2. 02
    Выберите обработку ссылок и заголовка

    Не включайте сноски для внешних ссылок без запроса. Решите, сохранять ли первый заголовок в теле статьи.

  3. 03
    Преобразуйте содержимое и диаграммы

    Запустите комплектный конвертер main.ts через Bun или документированный запасной вариант npx с выбранными параметрами оформления. Mermaid использует браузерную отрисовку PNG и кеш, когда они доступны.

  4. 04
    Проверьте результат для публикации

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

02 Когда использовать

Когда использовать

Навык создаёт HTML; публикация статьи — отдельное действие.

Хорошо подходит

  • Экспорт оформленных статейДля публикации статьи Markdown нужен HTML со стилями CSS в атрибутах элементов.
  • Форматирование для WeChatКонтенту нужны совместимые темы и, при необходимости, собранные внешние ссылки.

Ограничения

  • Границы преобразованияНавык создаёт HTML; публикация статьи — отдельное действие.
  • Диаграммы зависят от браузераДля отрисовки Mermaid в PNG нужен Chrome, Chromium или Edge.
  • Успех с резервным представлениемПреобразование может завершиться успешно, хотя диаграмма останется резервной разметкой, поэтому проверьте результат.

Что подготовить

  • Исходный MarkdownПредоставьте статью и локальные изображения, на которые она ссылается.
  • Параметры оформленияВыберите тему и при необходимости переопределите цвет, шрифт или заголовок.
  • Поведение при подготовке к публикацииУкажите режим сносок, сохранение заголовка и требования к диаграммам.

03 Важные решения

Важные решения

  1. Оформление для статей

    Встроенные в элементы стили CSS переносят выбранную тему в экспортированный документ.

  2. Явная обработка ссылок

    Сноски внизу включаются по запросу; для WeChat и URL без описательного текста документированы исключения.

  3. Восстанавливаемый результат

    Перед заменой существующего HTML создаётся резервная копия с отметкой времени.

04 Пример задания

Попробуйте конкретное задание

Приведённое ниже задание не тестировалось. Перед использованием проверьте настройку навыка.

Изучите исходные инструкции и настройку

Предоставьте статью и локальные изображения, на которые она ссылается.

Исходный файл в репозитории
https://github.com/jimliu/baoyu-skills/blob/0a27d7d40e79cfe42334e2e9130a1e41a499ca54/skills/baoyu-markdown-to-html/SKILL.md

Ссылка ниже открывает инструкции автора. Перед использованием изучите требования к настройке в репозитории; это не команда установки.

Начните с одного результата

Перед запуском навыка адаптируйте объём, исходные материалы и ограничения в этом задании.

Пример задания
Используй baoyu-markdown-to-html, чтобы преобразовать предоставленную статью с темой simple и выбранным акцентным цветом. Сохрани первый заголовок и включи сноски внизу для обычных внешних ссылок. Не изменяй исходный Markdown. В статье две диаграммы Mermaid: попробуй отрисовать их в PNG и проверь, содержит ли результат пригодные изображения или резервную разметку. Сообщи путь HTML, путь резервной копии при её наличии и созданные файлы диаграмм. Не публикуй статью. Отметь неподдерживаемое форматирование или отсутствующие локальные изображения, которые нужно исправить до передачи в процесс публикации.

Проверьте результат

Сверьте фактический результат с этими наблюдаемыми критериями.

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

OpenDesign предоставляет локальное дизайн-пространство для кодинг-агентов. Этот список не означает, что навык входит в комплект или что его внешние инструменты, учётные данные и программные зависимости включены.

05 Источник и лицензия

Исходные материалы и лицензия

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

Владелец источника
jimliu
Репозиторий
jimliu/baoyu-skills
Файл навыка
SKILL.md
Лицензия
MIT
Проверенный снимок
2026-11-02 · 0a27d7d40e79

Примечания к чтению

  1. Область действия лицензииТекст LICENSE репозитория проверен для зафиксированной ревизии; в полном списке имён файлов архива не обнаружено более конкретного LICENSE/COPYING/NOTICE внутри пути этого навыка. Классификация относится к проверенному исходному коду автора, а не к сгенерированным результатам или сторонним зависимостям. README указывает MIT для GitHub-репозитория, если не оговорено иное, тогда как опубликованные дистрибутивы ClawHub используют MIT-0. Здесь классифицируется зафиксированный исходный код из GitHub. Связанный код конвертера содержит в packages/baoyu-md/src/LICENSE уведомление WTFPL Version 2 для кода, адаптированного из doocs/md. Не обозначайте весь комплект зависимостей как единообразно лицензированный под MIT.
Редакционное резюме источника
Преобразуйте Markdown в оформленный HTML для публикации статей.

Оригинальное резюме от OpenDesign на основе указанного источника. Звёзды репозитория — датированный показатель популярности, а не использование навыка или оценка качества.

06 Вопросы перед началом

Вопросы перед началом

Внешние ссылки всегда переносятся вниз?

Нет. Режим сносок по умолчанию выключен и включается только по явному запросу.

Что происходит при сбое отрисовки Mermaid?

Конвертер может использовать предварительно отформатированную разметку Mermaid как запасной вариант, при этом преобразование в целом может завершиться успешно.

Навык заменяет существующий HTML-файл?

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

OpenDesign

Храните задание и работу над дизайном вместе.

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

Исходный файл в репозитории
https://github.com/jimliu/baoyu-skills/blob/0a27d7d40e79cfe42334e2e9130a1e41a499ca54/skills/baoyu-markdown-to-html/SKILL.md