Как сделать SSR с stencil.js в проекте с Nuxt.js (также SSR)

Question

Я хочу использовать библиотеку stencil в моем проекте nuxt.

Мне удалось заставить его работать, но пока компоненты vue рендерились на стороне сервера, я мог только сделать компонент stencil для рендеринга на стороне клиента.

Я думаю, что самая большая проблема в том, что defineCustomElement нуждается в window в качестве параметра.

Я знаю, что у stencil.js есть тот «предварительный вывод», который, по моему мнению, является в основном SSR, я хотел использовать его так же, как и Nuxt.js SSR.

Итак, мой вопрос: как настроить nuxt проект для поддержки рендеринга на стороне сервера для stencil.js?

Answer 1

Действительно, у вас есть обходной путь

1. Вы должны опубликовать свой веб-компонент в unpkg или любом другом публичном (или частном) CDN
2. В вашем файле nuxt.config.js добавьте скрипт в ваш скрипт раздела. Этот скрипт должен быть ссылкой на вашу публичную библиотеку (https://stenciljs.com/docs/javascript)

Для получения дополнительной информации о том, как добавить внешний ресурс в ваш текстовый проект, прочитайте: https://nuxtjs.org/faq/ -> Как использовать внешние ресурсы

Приветствия

Answer 2

Похоже, что Stencil v1 может разрешать SSR, согласно этому комментарию :

Stencil One будет использовать выходную цель dist-hydrate-script для генерации скрипт узла, который можно использовать для гидратации ваших скриптов. Тогда сгенерированный скрипт dist / hydrate / index.js - это то, что вы можете использовать в многочисленные местоположения (Angular Universal, Express Middleware, пользовательские предварительный рендеринг и т. д.).

Если вы делаете предварительный рендеринг, вы можете просто добавить --prerender пометьте свою трафаретную сборку, и она обработает все это для вас. Мы все еще активно работаем над этим и надеемся вскоре его отправить. Спасибо

Проблемы, связанные с Github:

https://github.com/ionic-team/stencil/issues/1036

https://github.com/ionic-team/stencil/issues/1449

Answer 3

о, да, как сказал Альдарунд, вы не можете, я лучше взглянул на страницу предварительной визуализации и там сказано, что предварительная визуализация происходит во время сборки, так что это будет невозможно:/ очень плохо