如何在具有Nuxt.js的项目中使用stencil.js进行SSR(SSR也是如此)

问题描述 投票:2回答:3

我想在我的stencil项目中使用nuxt库。

我能够让它工作,但是当vue组件在服务器端渲染时,我只能让stencil的组件在客户端渲染。

我认为最大的问题是defineCustomElement需要window作为参数。

我知道stencil.js有“prerender”,这在我的理解中基本上是SSR,我想用它和Nuxt.js SSR一样。

所以我的问题是:如何配置nuxt项目以支持stencil.js的服务器端呈现?

javascript nuxt.js ssr stenciljs
3个回答
2
投票

根据这个comment,看起来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


0
投票

哦,是的,正如Aldarund说的,你不能,我更好地看看prerendering page,并且说那里的预渲染发生在构建时间,所以这是不可能的:/太糟糕了


0
投票

的确,你有一个解决方法

  1. 您必须在unpkg或任何其他公共(或私有)CDN中发布您的Web组件
  2. 在您的nuxt.config.js文件中,在节脚本中添加脚本。这个脚本必须是你的公共lib(https://stenciljs.com/docs/javascript

有关如何向nuxt项目添加外部资源的更多信息,请阅读:https://nuxtjs.org/faq/ - >如何使用外部资源

干杯

© www.soinside.com 2019 - 2024. All rights reserved.