|
|
import{_ as i,c as a,ag as e,o as t}from"./chunks/framework.C1C4sYC0.js";const o=JSON.parse('{"title":"Первые шаги","description":"","frontmatter":{},"headers":[],"relativePath":"ru/guide/getting-started.md","filePath":"ru/guide/getting-started.md","lastUpdated":1736187882000}'),n={name:"ru/guide/getting-started.md"};function l(p,s,h,d,k,r){return t(),a("div",null,s[0]||(s[0]=[e(`<h1 id="getting-started" tabindex="-1">Первые шаги <a class="header-anchor" href="#getting-started" aria-label="Permalink to "Первые шаги {#getting-started}""></a></h1><h2 id="try-it-online" tabindex="-1">Попробуйте онлайн <a class="header-anchor" href="#try-it-online" aria-label="Permalink to "Попробуйте онлайн {#try-it-online}""></a></h2><p>Вы можете попробовать VitePress прямо в браузере на <a href="https://vitepress.new" target="_blank" rel="noreferrer">StackBlitz</a>.</p><h2 id="installation" tabindex="-1">Установка <a class="header-anchor" href="#installation" aria-label="Permalink to "Установка {#installation}""></a></h2><h3 id="prerequisites" tabindex="-1">Требования <a class="header-anchor" href="#prerequisites" aria-label="Permalink to "Требования {#prerequisites}""></a></h3><ul><li><a href="https://nodejs.org/" target="_blank" rel="noreferrer">Node.js</a> версии 18 или выше.</li><li>Терминал для доступа к VitePress через интерфейс командной строки (CLI).</li><li>Текстовый редактор с поддержкой синтаксиса <a href="https://ru.wikipedia.org/wiki/Markdown" target="_blank" rel="noreferrer">Markdown</a>. <ul><li>Рекомендуется использовать <a href="https://code.visualstudio.com/" target="_blank" rel="noreferrer">VSCode</a>, а также <a href="https://marketplace.visualstudio.com/items?itemName=Vue.volar" target="_blank" rel="noreferrer">официальное расширение Vue</a>.</li></ul></li></ul><p>VitePress можно использовать самостоятельно или установить в существующий проект. В обоих случаях вы можете установить его с помощью:</p><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-XDHVc" id="tab-MnfHnyt" checked><label data-title="npm" for="tab-MnfHnyt">npm</label><input type="radio" name="group-XDHVc" id="tab-Jad7wQl"><label data-title="pnpm" for="tab-Jad7wQl">pnpm</label><input type="radio" name="group-XDHVc" id="tab-krl1ulO"><label data-title="yarn" for="tab-krl1ulO">yarn</label><input type="radio" name="group-XDHVc" id="tab-6iojCUb"><label data-title="yarn (pnp)" for="tab-6iojCUb">yarn (pnp)</label><input type="radio" name="group-XDHVc" id="tab-ikOKcgK"><label data-title="bun" for="tab-ikOKcgK">bun</label></div><div class="blocks"><div class="language-sh vp-adaptive-theme active"><button title="Скопировать код" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">$</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> npm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> -D</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> vitepress</span></span></code></pre></div><div class="language-sh vp-adaptive-theme"><button title="Скопировать код" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">$</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> pnpm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> -D</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> vitepress</span></span></code></pre></div><div class="language-sh vp-adaptive-theme"><button title="Скопировать код" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">$</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> yarn</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> -D</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> vitepress</span></span></code></pre></div><div class="language-sh vp-adaptive-theme"><button title="Скопировать код" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">$</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> yarn</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> -D</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> vitepress</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> vue</span></span></code></pre></div><div class="language-sh vp-adaptive-theme"><button title="Скопировать код" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">$</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> bun</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> -D</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> vitepress</span></span></code></pre></div></div></div><details class="details custom-block"><summary>Получаете предупреждения об отсутствующих зависимостях?</summary><p>Если вы используете PNPM, вы заметите предупреждение об отсутствующем пакете <code>@docsearch/js</code>. Это не мешает работе VitePress. Если вы хотите подавить это предупреждение, добавьте следующее в ваш <code>package.json</code>:</p><div class="language-json vp-adaptive-theme"><button title="Скопировать код" class="copy"></button><span class="lang">json</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">"pnpm"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: {</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> "peerDependencyRules"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: {</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> "ignoreMissing"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: [</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> "@algolia/client-search"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> "search-insights"</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> ]</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> }</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div></details><div class="tip custom-block"><p class="custom-block-title">ПРИМЕЧАНИЕ</p><p>VitePress — это пакет, предназначенный только для ESM. Не используйте <code>require()</code> для импорта, и убедитесь, что ближайший <code>package.json</code> содержит <code>"type": "module"</code>, или измените расширение соответствующих файлов, например, <code>.vitepress/config.js</code> на <code>.mjs</code>/<code>.mts</code>. Более подробную информацию см. в <a href="https://vitejs.dev/guide/troubleshooting.html#this-package-is-esm-only" target="_blank" rel="noreferrer">Руководстве по устранению неполадок Vite</a>. Кроме того, внутри асинхронных контекстов CJS можно использовать <code>await import('vitepress')</code> вместо этого.</p></div><h3 id="setup-wizard" tabindex="-1">Мастер настройки <a class="header-anchor" href="#setup-wizard" aria-label="Permalink to "Мастер настройки {#setup-wizard}""></a></h3><p>VitePress поставляется с мастером настройки командной строки, который поможет вам создать базовый проект. После установки запустите мастер, выполнив команду:</p><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-83mtJ" id="tab-Ig_V4UL" checked><label data-title="npm" for="tab-Ig_V4UL">npm</label><input type="radio" name="group-83mtJ" id="tab-oMCeI1g"><label data-title="pnpm" for="tab-oMCeI1g">pnpm</label><input type="radio" name="group-83mtJ" id="tab-JFF63DD"><label data-title="yarn" for="tab-JFF63DD">yarn</label><input type="radio" name="group-83mtJ" id="tab-A-VWMeh"><label data-title="bun" for="tab-A-VWMeh">bun</label></div><div class="blocks"><div class="language-sh vp-adaptive-theme active"><button title="Скопировать код" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">$</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> npx</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> vitepress</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> init</span></span></code></pre></div><div class="language-sh vp-adaptive-theme"><button title="Скопировать код" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">$</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> pnpm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> vitepress</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> init</span></span></code></pre></div><div class="language-sh vp-adaptive-theme"><button title="Скопировать код" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">$</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> yarn</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> vitepress</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> init</span></span></code></pre></div><div class="language-sh vp-adaptive-theme"><button title="Скопировать код" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">$</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> bun</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> vitepress</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> init</span></span></code></pre></div></div></div><p>Вас встретят несколькими простыми вопросами:</p><div class="language- vp-adaptive-theme"><button title="Скопировать код" class="copy"></button><span class="lang"></span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#959da5;--shiki-dark:#959da5;">┌</span><span style="--shiki-light:#1b7c83;--shiki-light-font-weight:bold;--shiki-dark:#39c5cf;--shiki-dark-font-weight:bold;"> Welcome to VitePress!</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#959da5;--shiki-dark:#959da5;">│</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#28a745;--shiki-dark:#34d058;">◇</span><span style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;"> Where should VitePress initialize the config?</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#959da5;--shiki-dark:#959da5;">│</span><span style="--shiki-light:#24292e80;--shiki-dark:#e1e4e880;"> ./docs</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#959da5;--shiki-dark:#959da5;">│</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#28a745;--shiki-dark:#34d058;">◇</span><span style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;"> Site title:</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#959da5;--shiki-dark:#959da5;">│</span><span style="--shiki-light:#24292e80;--shiki-dark:#e1e4e880;"> My Awesome Project</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#959da5;--shiki-dark:#959da5;">│</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#28a745;--shiki-dark:#34d058;">◇</span><span style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;"> Site description:</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#959da5;--shiki-dark:#959da5;">│</span><span style="--shiki-light:#24292e80;--shiki-dark:#e1e4e880;"> A VitePress Site</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#959da5;--shiki-dark:#959da5;">│</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#1b7c83;--shiki-dark:#39c5cf;">◆</span><span style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;"> Theme:</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#1b7c83;--shiki-dark:#39c5cf;">│</span><span style="--shiki-light:#28a745;--shiki-dark:#34d058;"> ●</span><span style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;"> Default Theme </span><span style="--shiki-light:#24292e80;--shiki-dark:#e1e4e880;">(Out of the box, good-looking docs)</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#1b7c83;--shiki-dark:#39c5cf;">│</span><span style="--shiki-light:#24292e80;--shiki-dark:#e1e4e880;"> ○</span><span style="--shiki-light:#24292e80;--shiki-dark:#e1e4e880;"> Default Theme + Customization</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#1b7c83;--shiki-dark:#39c5cf;">│</span><span style="--shiki-light:#24292e80;--shiki-dark:#e1e4e880;"> ○</span><span style="--shiki-light:#24292e80;--shiki-dark:#e1e4e880;"> Custom Theme</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#1b7c83;--shiki-dark:#39c5cf;">└</span></span></code></pre></div><div class="tip custom-block"><p class="custom-block-title">Vue как зависимость</p><p>Если вы собираетесь выполнять кастомизацию с использованием компонентов или API Vue, вам также следует явно установить <code>vue</code> в качестве зависимости.</p></div><h2 id="file-structure" tabindex="-1">Структура файлов <a class="header-anchor" href="#file-structure" aria-label="Permalink to "Структура файлов {#file-structure}""></a></h2><p>Если вы создаете отдельный сайт VitePress, вы можете разместить его в текущей директории (<code>./</code>). Однако если вы устанавливаете VitePress в существующий проект вместе с другим исходным кодом, рекомендуется поместить сайт во вложенную директорию (например, <code>./docs</code>), чтобы он был отделён от остальной части проекта.</p><p>Если предположить, что вы решили разместить проект VitePress в <code>./docs</code>, то сгенерированная структура файлов должна выглядеть следующим образом:</p><div class="language- vp-adaptive-theme"><button title="Скопировать код" class="copy"></button><span class="lang"></span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span>.</span></span>
|
|
|
<span class="line"><span>├─ docs</span></span>
|
|
|
<span class="line"><span>│ ├─ .vitepress</span></span>
|
|
|
<span class="line"><span>│ │ └─ config.js</span></span>
|
|
|
<span class="line"><span>│ ├─ api-examples.md</span></span>
|
|
|
<span class="line"><span>│ ├─ markdown-examples.md</span></span>
|
|
|
<span class="line"><span>│ └─ index.md</span></span>
|
|
|
<span class="line"><span>└─ package.json</span></span></code></pre></div><p>Директория <code>docs</code> считается <strong>корнем проекта</strong> сайта VitePress. Директория <code>.vitepress</code> — это зарезервированное место для конфигурационного файла VitePress, кэша dev-сервера, результатов сборки и дополнительного кода настройки темы.</p><div class="tip custom-block"><p class="custom-block-title">СОВЕТ</p><p>По умолчанию VitePress хранит кэш своего dev-сервера в файле <code>.vitepress/cache</code>, а выходные данные сборки — в файле <code>.vitepress/dist</code>. Если вы используете Git, вам следует добавить их в файл <code>.gitignore</code>. Эти места также могут быть <a href="./../reference/site-config#outdir">сконфигурированы</a>.</p></div><h3 id="the-config-file" tabindex="-1">Конфигурационный файл <a class="header-anchor" href="#the-config-file" aria-label="Permalink to "Конфигурационный файл {#the-config-file}""></a></h3><p>Файл конфигурации (<code>.vitepress/config.js</code>) позволяет настраивать различные аспекты сайта VitePress, самыми основными из которых являются название и описание сайта:</p><div class="vp-code-block-title"><div class="vp-code-block-title-bar"><span class="vp-code-block-title-text" data-title=".vitepress/config.js">.vitepress/config.js</span></div><div class="language-js vp-adaptive-theme"><button title="Скопировать код" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">export</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> default</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> // параметры сайта</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> title: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'Заголовок сайта'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> description: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'Описание сайта.'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
|
|
|
<span class="line"></span>
|
|
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> themeConfig: {</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> // параметры темы</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> }</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div></div><p>Вы также можете настроить поведение темы с помощью опции <code>themeConfig</code>. Загляните в главу <a href="./../reference/site-config">Конфигурация сайта</a> для получения подробной информации обо всех настраиваемых параметрах.</p><h3 id="source-files" tabindex="-1">Исходные файлы <a class="header-anchor" href="#source-files" aria-label="Permalink to "Исходные файлы {#source-files}""></a></h3><p>Файлы Markdown за пределами директории <code>.vitepress</code> считаются <strong>исходными файлами</strong>.</p><p>VitePress использует <strong>маршрутизацию на основе файлов</strong>: Каждый файл <code>.md</code> компилируется в соответствующий файл <code>.html</code> с тем же путём. Например, <code>index.md</code> будет скомпилирован в <code>index.html</code>, и его можно будет посетить по корневому пути <code>/</code> результирующего сайта VitePress.</p><p>VitePress также предоставляет возможность генерировать чистые URL-адреса, переписывать пути и динамически генерировать страницы. Всё это будет рассмотрено в <a href="./routing">Руководстве по маршрутизации</a>.</p><h2 id="up-and-running" tabindex="-1">Скрипты запуска <a class="header-anchor" href="#up-and-running" aria-label="Permalink to "Скрипты запуска {#up-and-running}""></a></h2><p>Мастер настройки также должен был внедрить следующие скрипты npm в ваш <code>package.json</code>, если вы разрешили ему это сделать в процессе установки:</p><div class="vp-code-block-title"><div class="vp-code-block-title-bar"><span class="vp-code-block-title-text" data-title="package.json">package.json</span></div><div class="language-json vp-adaptive-theme"><button title="Скопировать код" class="copy"></button><span class="lang">json</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">{</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#B31D28;--shiki-light-font-style:italic;--shiki-dark:#FDAEB7;--shiki-dark-font-style:italic;"> ...</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> "scripts"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: {</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> "docs:dev"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">"vitepress dev docs"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> "docs:build"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">"vitepress build docs"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> "docs:preview"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">"vitepress preview docs"</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> },</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#B31D28;--shiki-light-font-style:italic;--shiki-dark:#FDAEB7;--shiki-dark-font-style:italic;"> ...</span></span>
|
|
|
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div></div><p>Скрипт <code>docs:dev</code> запустит локальный dev-сервер с мгновенными горячими обновлениями. Выполните следующую команду:</p><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-dCTXn" id="tab-RzHc2-D" checked><label data-title="npm" for="tab-RzHc2-D">npm</label><input type="radio" name="group-dCTXn" id="tab-57Ikxdh"><label data-title="pnpm" for="tab-57Ikxdh">pnpm</label><input type="radio" name="group-dCTXn" id="tab-dVSeX67"><label data-title="yarn" for="tab-dVSeX67">yarn</label><input type="radio" name="group-dCTXn" id="tab-4Pu52BQ"><label data-title="bun" for="tab-4Pu52BQ">bun</label></div><div class="blocks"><div class="language-sh vp-adaptive-theme active"><button title="Скопировать код" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">$</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> npm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> run</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> docs:dev</span></span></code></pre></div><div class="language-sh vp-adaptive-theme"><button title="Скопировать код" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">$</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> pnpm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> run</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> docs:dev</span></span></code></pre></div><div class="language-sh vp-adaptive-theme"><button title="Скопировать код" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">$</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> yarn</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> docs:dev</span></span></code></pre></div><div class="language-sh vp-adaptive-theme"><button title="Скопировать код" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">$</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> bun</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> run</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> docs:dev</span></span></code></pre></div></div></div><p>Вместо npm-скриптов вы также можете вызывать VitePress напрямую с помощью:</p><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-GXozn" id="tab-nEz2tvX" checked><label data-title="npm" for="tab-nEz2tvX">npm</label><input type="radio" name="group-GXozn" id="tab-tfjvt-V"><label data-title="pnpm" for="tab-tfjvt-V">pnpm</label><input type="radio" name="group-GXozn" id="tab-6KLCpfq"><label data-title="yarn" for="tab-6KLCpfq">yarn</label><input type="radio" name="group-GXozn" id="tab-VaaStjk"><label data-title="bun" for="tab-VaaStjk">bun</label></div><div class="blocks"><div class="language-sh vp-adaptive-theme active"><button title="Скопировать код" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">$</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> npx</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> vitepress</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> dev</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> docs</span></span></code></pre></div><div class="language-sh vp-adaptive-theme"><button title="Скопировать код" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">$</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> pnpm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> vitepress</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> dev</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> docs</span></span></code></pre></div><div class="language-sh vp-adaptive-theme"><button title="Скопировать код" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">$</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> yarn</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> vitepress</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> dev</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> docs</span></span></code></pre></div><div class="language-sh vp-adaptive-theme"><button title="Скопировать код" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">$</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> bun</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> vitepress</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> dev</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> docs</span></span></code></pre></div></div></div><p>Более подробная информация об использовании командной строки описана в главе <a href="./../reference/cli">Командная строка</a>.</p><p>Dev-сервер должен быть запущен по адресу <code>http://localhost:5173</code>. Перейдите по URL-адресу в браузере, чтобы увидеть новый сайт в действии!</p><h2 id="what-s-next" tabindex="-1">Что дальше? <a class="header-anchor" href="#what-s-next" aria-label="Permalink to "Что дальше? {#what-s-next}""></a></h2><ul><li><p>Чтобы лучше понять, как Markdown-файлы сопоставляются с генерируемым HTML, перейдите к <a href="./routing">Руководству по маршрутизации</a>.</p></li><li><p>Чтобы узнать больше о том, что вы можете делать на странице, например, писать содержимое в формате Markdown или использовать компоненты Vue, обратитесь к разделу «Написание». Начать стоит с изучения главы <a href="./markdown">Расширения Markdown</a>.</p></li><li><p>Чтобы изучить возможности, предоставляемые темой документации по умолчанию, ознакомьтесь с главой <a href="./../reference/default-theme-config">Настройка темы по умолчанию</a>.</p></li><li><p>Если вы хотите ещё больше изменить внешний вид своего сайта, изучите главы <a href="./extending-default-theme">Расширение темы по умолчанию</a> или <a href="./custom-theme">Пользовательская тема</a>.</p></li><li><p>Как только ваш сайт документации обретёт форму, обязательно прочитайте <a href="./deploy">Руководство по развёртыванию</a>.</p></li></ul>`,41)]))}const g=i(n,[["render",l]]);export{o as __pageData,g as default};
|
