# Попередній локальний перегляд змін

LLMS index: [llms.txt](/llms.txt)

---

<!-- overview -->

Before you're going to [open a new PR](/docs/contribute/new-content/open-a-pr/), previewing your changes is recommended. A preview lets you catch build errors or markdown formatting problems.

## Попередній перегляд змін локально {#preview-locally}

Ви можете або створити образ контейнера вебсайту, або запустити Hugo локально. Створення образу контейнера відбувається повільніше, але відображає [Hugo shortcodes](/docs/contribute/style/hugo-shortcodes/), що може бути корисним для налагодження.

<ul class="nav nav-tabs" id="tabs-tab-with-hugo" role="tablist"><li class="nav-item"><a data-bs-toggle="tab" class="nav-link active" href="#tabs-tab-with-hugo-0" role="tab" aria-controls="tabs-tab-with-hugo-0" aria-selected="true">Hugo в контейнері</a></li>
	  
		<li class="nav-item"><a data-bs-toggle="tab" class="nav-link" href="#tabs-tab-with-hugo-1" role="tab" aria-controls="tabs-tab-with-hugo-1">Hugo в командному рядку</a></li></ul>

<div class="tab-content" id="tabs-tab-with-hugo-content"><div class="tab-body tab-pane fadeshow active"
        id="tabs-tab-with-hugo-0" role="tabpanel" aria-labelledby="tabs-tab-with-hugo-0-tab" tabindex="tab-with-hugo"><div class="alert alert-info" role="note"><h4 class="alert-heading">Примітка:</h4>Наведені нижче команди використовують Docker як стандартний контейнерний рушій. Щоб змінити це налаштування, встановіть змінну середовища <code>CONTAINER_ENGINE</code>.</div>
<ol>
<li>
<p>Створіть образ контейнера локально <em>Цей крок необхідний лише у випадку, якщо ви тестуєте зміни в самому інструменті Hugo</em></p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-shell" data-lang="shell"><span class="line"><span class="cl"><span class="c1"># Запустіть це в терміналі (якщо потрібно)</span>
</span></span><span class="line"><span class="cl">make container-image
</span></span></code></pre></div></li>
<li>
<p>Завантажте залежності субмодуля у свій локальний репозиторій:</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-shell" data-lang="shell"><span class="line"><span class="cl"><span class="c1"># Запустіть це в терміналі</span>
</span></span><span class="line"><span class="cl">make module-init
</span></span></code></pre></div></li>
<li>
<p>Запустіть Hugo в контейнері:</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-shell" data-lang="shell"><span class="line"><span class="cl"><span class="c1"># Запустіть це в терміналі</span>
</span></span><span class="line"><span class="cl">make container-serve
</span></span></code></pre></div></li>
<li>
<p>У вебоглядачі перейдіть за адресою <code>http://localhost:1313</code>. Hugo відстежує зміни та перекомпілює сайт за потреби.</p>
</li>
<li>
<p>Щоб зупинити локальний екземпляр Hugo, поверніться до терміналу та натисніть <code>Ctrl+C</code> або закрийте вікно терміналу.</p>
</li>
</ol>
</div><div class="tab-body tab-pane fade"
        id="tabs-tab-with-hugo-1" role="tabpanel" aria-labelledby="tabs-tab-with-hugo-1-tab" tabindex="tab-with-hugo"><p>Або ж встановіть і використовуйте команду <code>hugo</code> на своєму компʼютері:</p>
<ol>
<li>
<p>Встановіть версії <a href="https://gohugo.io/getting-started/installing/">Hugo (розширена версія)</a> та <a href="https://nodejs.org/en">Node</a>, зазначені у файлі <a href="https://raw.githubusercontent.com/kubernetes/website/main/netlify.toml"><code>website/netlify.toml</code></a>.</p>
</li>
<li>
<p>Встановіть усі залежності:</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-shell" data-lang="shell"><span class="line"><span class="cl">npm ci
</span></span></code></pre></div></li>
<li>
<p>У терміналі перейдіть до репозиторію вебсайту Kubernetes і запустіть сервер Hugo:</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-shell" data-lang="shell"><span class="line"><span class="cl"><span class="nb">cd</span> &lt;path_to_your_repo&gt;/website
</span></span><span class="line"><span class="cl">make serve
</span></span></code></pre></div><p>Якщо ви використовуєте компʼютер з ОС Windows або не можете виконати команду <code>make</code>, скористайтеся наступною командою:</p>
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-shell" data-lang="shell"><span class="line"><span class="cl">hugo server --config hugo.toml,hugo.server.toml --buildFuture
</span></span></code></pre></div></li>
<li>
<p>У вебоглядачі перейдіть за адресою <code>http://localhost:1313</code>. Hugo відстежує зміни та за потреби перебудовує сайт.</p>
</li>
<li>
<p>Щоб зупинити локальний екземпляр Hugo, поверніться до терміналу та натисніть <code>Ctrl+C</code> або закрийте вікно терміналу.</p>
</li>
</ol>
</div></div>


## Усунення несправностей {#troubleshooting}

### error: failed to transform resource: TOCSS: failed to transform "scss/main.scss" (text/x-scss): this feature is not available in your current Hugo

version  Hugo постачається у двох наборах бінарних файлів з технічних причин. Поточний вебсайт працює виключно на основі версії **Hugo Extended**. На [сторінці випуску](https://github.com/gohugoio/hugo/releases) знайдіть архіви з назвою, що містить слово `extended`. Щоб підтвердити, запустіть `hugo version` і знайдіть слово `extended`.

### Усунення несправностей macOS через занадто велику кількість відкритих файлів {#troubleshooting-macos-for-too-many-open-files}

Якщо ви запускаєте `make serve` в macOS і отримуєте таку помилку:

```bash
ERROR 2020/08/01 19:09:18 Error: listen tcp 127.0.0.1:1313: socket: too many open files
make: *** [serve] Error 1
```

Спробуйте перевірити поточний ліміт відкритих файлів:

`launchctl limit maxfiles`

Потім виконайте наступні команди (на основі <https://gist.github.com/tombigel/d503800a282fcadbee14b537735d202c>):

```shell
#!/bin/sh

# These are the original gist links, linking to my gists now.
# curl -O https://gist.githubusercontent.com/a2ikm/761c2ab02b7b3935679e55af5d81786a/raw/ab644cb92f216c019a2f032bbf25e258b01d87f9/limit.maxfiles.plist
# curl -O https://gist.githubusercontent.com/a2ikm/761c2ab02b7b3935679e55af5d81786a/raw/ab644cb92f216c019a2f032bbf25e258b01d87f9/limit.maxproc.plist

curl -O https://gist.githubusercontent.com/tombigel/d503800a282fcadbee14b537735d202c/raw/ed73cacf82906fdde59976a0c8248cce8b44f906/limit.maxfiles.plist
curl -O https://gist.githubusercontent.com/tombigel/d503800a282fcadbee14b537735d202c/raw/ed73cacf82906fdde59976a0c8248cce8b44f906/limit.maxproc.plist

sudo mv limit.maxfiles.plist /Library/LaunchDaemons
sudo mv limit.maxproc.plist /Library/LaunchDaemons

sudo chown root:wheel /Library/LaunchDaemons/limit.maxfiles.plist
sudo chown root:wheel /Library/LaunchDaemons/limit.maxproc.plist

sudo launchctl load -w /Library/LaunchDaemons/limit.maxfiles.plist
```

Це працює як для Catalina, так і для Mojave macOS.

### Unable to find image 'gcr.io/k8s-staging-sig-docs/k8s-website-hugo:VERSION' locally

Якщо ви запускаєте `make container-serve` і бачите цю помилку, це може бути повʼязано з локальними змінами, внесеними до певних файлів [визначених](https://github.com/kubernetes/website/blob/main/Makefile#L10) у `$IMAGE_VERSION` файлу `Makefile`.

Версія образу вебсайту включає хеш, який генерується на основі вмісту перелічених файлів. Наприклад, якщо `1b9242684415` є хешем  для цих файлів, образ вебсайту буде називатися `k8s-website-hugo:v0.133.0-1b9242684415`. Виконання `make container-serve` спробує витягнути такий образ із GCR вебсайту Kubernetes. Якщо це не поточна версія, ви побачите повідомлення про помилку, що цей образ відсутній.

Якщо вам потрібно внести зміни в ці файли та переглянути вебсайт, вам доведеться створити локальний образ замість витягування попередньо створеного. Для цього виконайте `make container-image`.

### Інші проблеми {#other-issues}

Якщо у вас виникли інші проблеми з локальним запуском вебсайту та/або попереднім переглядом змін, не соромтеся [відкрити тікет](https://github.com/kubernetes/website/issues/new/choose) у репозиторії GitHub `kubernetes/website`.
