Это специальный контейнер, который можно использовать для предотвращения конфликтов стилей и маршрутизаторов с VitePress. Это особенно полезно при документировании библиотек компонентов. Вы также можете посмотреть [whyframe](https://whyframe.dev/docs/integrations/vitepress) для лучшей изоляции.
Это специальный контейнер, который можно использовать для предотвращения конфликтов стилей и маршрутизаторов с VitePress. Это особенно полезно при документировании библиотек компонентов. Вы также можете посмотреть [whyframe](https://whyframe.dev/docs/integrations/vitepress) для лучшей изоляции.
**Syntax**
**Синтаксис**
```md
```md
::: raw
::: raw
@ -836,6 +836,43 @@ export default config
Формат выбранного диапазона строк может быть следующим: `{3,}`, `{,10}`, `{1,10}`
Формат выбранного диапазона строк может быть следующим: `{3,}`, `{,10}`, `{1,10}`
Вы также можете использовать [блоки кода VS Code](https://code.visualstudio.com/docs/editor/codebasics#_folding), чтобы включить только соответствующую часть файла. Можно указать пользовательское имя блока после `#`, следующего за путём к файлу:
Обратите внимание, что это не приводит к ошибкам, если ваш файл отсутствует. Поэтому при использовании этой функции убедитесь, что содержимое отображается так, как ожидается.
Обратите внимание, что это не приводит к ошибкам, если ваш файл отсутствует. Поэтому при использовании этой функции убедитесь, что содержимое отображается так, как ожидается.
См. [`socialLinks`](./default-theme-config#sociallinks).
См. [`socialLinks`](./default-theme-config#sociallinks).
## Пользовательские компоненты
Вы можете добавить пользовательские компоненты в панель навигации с помощью опции `component`. Ключ `component` должен быть именем компонента Vue и должен быть зарегистрирован глобально с помощью [Theme.enhanceApp](../guide/custom-theme#theme-interface).
```js
// .vitepress/config.js
export default {
themeConfig: {
nav: [
{
text: 'Мое меню',
items: [
{
component: 'MyCustomComponent',
// Необязательные параметры для передачи компоненту
props: {
title: 'Мой пользовательский компонент'
}
}
]
},
{
component: 'AnotherCustomComponent'
}
]
}
}
```
Затем необходимо зарегистрировать компонент глобально:
```js
// .vitepress/theme/index.js
import DefaultTheme from 'vitepress/theme'
import MyCustomComponent from './components/MyCustomComponent.vue'
import AnotherCustomComponent from './components/AnotherCustomComponent.vue'
Включать ли тёмный режим (путём добавления класса `.dark` к элементу `<html>`).
Включать ли тёмный режим (путём добавления класса `.dark` к элементу `<html>`).
@ -497,6 +497,8 @@ export default {
- Если опция имеет значение `true`, тема по умолчанию будет определяться цветовой гаммой, предпочитаемой пользователем.
- Если опция имеет значение `true`, тема по умолчанию будет определяться цветовой гаммой, предпочитаемой пользователем.
- Если опция имеет значение `dark`, тема по умолчанию будет тёмной, если пользователь не переключит её вручную.
- Если опция имеет значение `dark`, тема по умолчанию будет тёмной, если пользователь не переключит её вручную.
- Если установить значение `false`, пользователи не смогут переключать тему.
- Если установить значение `false`, пользователи не смогут переключать тему.
- Если для опции установлено значение `force-dark`, тема всегда будет темной, и пользователи не смогут её переключать.
- Если для опции установлено значение `force-auto`, тема всегда будет определяться предпочитаемой пользователем цветовой схемой, и пользователи не смогут её переключать.
Эта опция вставляет встроенный скрипт, который восстанавливает настройки пользователей из локального хранилища с помощью ключа `vitepress-theme-appearance`. Это гарантирует, что класс `.dark` будет применён до отрисовки страницы, чтобы избежать мерцания.
Эта опция вставляет встроенный скрипт, который восстанавливает настройки пользователей из локального хранилища с помощью ключа `vitepress-theme-appearance`. Это гарантирует, что класс `.dark` будет применён до отрисовки страницы, чтобы избежать мерцания.