Эта статья была размещена в оригинале на puruvjdev.now.sh. Узнайте больше о StencilJS и веб-разработке здесь.

Я предполагаю, что если вы здесь, вы уже немного знаете о StencilJS, если нет, то посмотрите на этот супер классный фреймворк.

Предыстория

Когда я создавал этот блог, я пытался использовать Stencil Helmet для динамического добавления некоторых тегов к тегу<head>, и эти динамические теги отображались на предварительно обработанных страницах. Вы даже можете подтвердить их существование прямо сейчас, нажав комбинацию клавиш Ctrl+U или вручную набрав view-source: после фактического URL-адреса.

view-source:https://puruvjdev.now.sh

Итак, произошло следующее: я внес некоторые изменения в свой код, и мое приложение перестало выполнять предварительную визуализацию. Просто так. Это не предварительный рендеринг.

Это было неприемлемо. Предварительный рендеринг абсолютно необходим для создания быстрого и оптимизированного для SEO сайта.

Итак, я углубился в свои коммиты git, и БАМ! Был виновник, скрывающийся прямо в файле index.html на 3-й строке. Славный.....

<title>Something</title>

Вернее, его отсутствие. Видите ли, я удалил тег title, чтобы иметь возможность управлять динамическим управлением заголовками в своих компонентах.

Решение

Всегда сохраняйте тег title в файле index.html.

Я просто добавил тег title и все заработало.

Надеюсь, вы что-то вынесли из этого поста.

Подписание!

Первоначально опубликовано на https://puruvjdev.now.sh.