Вступление к теме
Первоначальное намерение
Первоначальная цель создания этой темы заключалась в том, чтобы обнаружить, что VuePress — это просто чистый генератор статических документов. Например, он не будет внедрять метатеги для SEO-оптимизации и не будет генерировать карту сайта, чтобы помочь поисковым системам индексировать содержимое документа.
Хотя VuePress в определенной степени расширил синтаксис Markdown, в нем по-прежнему отсутствуют некоторые часто используемые функции, такие как выравнивание текста, отметка, блок-схема, формула, презентация и т. д. В то же время некоторые функции, предоставляемые темой по умолчанию, слабы или отсутствуют. , такие как предварительный просмотр изображения, темный режим и т. д.
В этом случае родился дизайн vuepress-theme-hope.
Эта тема не только значительно улучшает внешний вид по сравнению с @vuepress/theme-default, но также предназначена для предоставления полного спектра улучшений для VuePress с помощью своих плагинов.
Этот проект не только тема
Хотя vuepress-theme-hope/vuepress-theme-hope сам по себе помечен как репозиторий тем, он также содержит более десятка одинаково полный и мощный плагин. Каждый плагин также является мощным, его можно использовать с темой по умолчанию или сторонними темами.
Основываясь на такой дюжине плагинов, Mr.Hope может с уверенностью сказать, что vuepress-theme-hope — это «Мощная тема с множеством функций». Его также можно рассматривать как наиболее универсальную и всеобъемлющую тему среди всех тем VuePress.
Цели дизайна
Цель V1
Направление: все функции предназначены для улучшения документа содержание и предоставление общего доступа.
Мощные и независимые функции: тема предоставляет подробные сведения о функциях и разбивает их на независимые плагины, чтобы пользователи могли использовать их в других темах.
Нулевая или простая конфигурация: все функции этой темы предназначены для работы с нулевой или простой конфигурацией, чтобы сократить ваши затраты на миграцию или обучение, в то же время наслаждаясь их удобством.
На основании достигнутой цели V1 далее осуществляется v2:
Улучшенный внешний вид: интерфейс темы не основан на макете и стиле темы по умолчанию, а полностью переработан.
Функции развязки: с помощью API композиции Vue3 тема полностью достигает «Tree-shaking», оставаясь при этом мощной.
Тема будет работать только с теми функциями, которые вам нужны, не замедляясь другими функциями и не влияя на размер сборки.
Почему мощный
Богатство контента
Тема предоставляет расширенную поддержку синтаксиса для Markdown, позволяя вам вставлять больше контента в тело.
Если вы любитель литературы и хотите разместить несколько эссе, в теме предусмотрено Пользовательское выравнивание и сноска.
Для хранения некоторых заметок тема предоставляет поддержку Пользовательского контейнера, Выделения, Значка、Списока задач и Tex.
Если вы программист и вам нужно показать много кодов и демонстраций, эта тема предоставляет светлые и темные темы для блоков кода, вкладки кода и кнопка "скопировать в один клик". В то же время мы также предоставляем функцию Демонстрация кода, которая удобна для вас, чтобы показать свои собственные компоненты Vue, React или другие демонстрации.
Если вы предоставляете документацию и презентацию продукта, тема предоставляет вкладки, слайд, диаграмму, блок-схема, диаграмма mermaid functions.
Короче говоря, каждый может насладиться удобством расширенного синтаксиса Markdown.
Пользовательский интерфейс страницы
Страница: Информация о странице, оглавление и функция предварительного просмотра изображения.
Структура сайта:
Перестроить мобильную панель навигации в упрощенной конфигурации Навбар и Сайдбар, добавить поддержку иконок и префиксов пути.
Макет: добавлена поддержка breadcrumb и footer.
Домашняя страница: Новый внешний вид, иконки поддержки функций и ссылки.
Настройка темы блока кода: Позволяет свободно настраивать стиль блока кода
Функция поиска
Тема добавляет встроенную поддержку официального поискового плагина VuePress.
Полная поддержка блога
Тема содержит полную поддержку блога, вы можете использовать совершенно новую домашнюю страницу блога.
Предоставляет категории, теги, временную шкалу, избранные статьи и другие функции.
Предоставляет функцию Комментарии и просмотры страниц, чтобы вы могли общаться со своими посетителями
Обеспечивает генерацию Feed, чтобы другие могли подписаться на ваш сайт.
Поисковая оптимизация
Предоставляет Улучшение СЕО, автоматически вводит информацию для полной поддержки протоколов OGP и JSON-LD и улучшает индексацию поисковыми системами.
Предоставляет Создание карты сайта
Предоставляет PWA
Другие
- Предоставляет функцию Добавление информации об авторских правах, которая может добавлять информацию об авторских правах, когда пользователи копируют контент, или отключать копирование и выбор страницы
- Предоставляет функцию шифрование статей для защиты личной информации