在带有Nuxt.js的项目中如何使用stencil.js进行SSR(也包括SSR)

时间:2019-01-23 10:15:10

标签: javascript nuxt.js ssr stenciljs

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

我能够使其工作,但是在服务器端呈现vue组件时,我只能使stencil的组件呈现在客户端。

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

我知道stencil.js具有“ prerender”,在我的理解中,它基本上是SSR,我想同时使用它和Nuxt.js SSR。

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

3 个答案:

答案 0 :(得分:1)

根据comment,Stencil v1似乎可以解决SSR:

  

模板一将使用dist-hydrate-script输出目标生成   可以用于合并脚本的节点脚本。然后   您可以在生成的dist / hydr / index.js脚本中重复使用   众多位置(Angular Universal,Express Middleware,自定义   预渲染等)。

     

如果要进行预渲染,则只需添加--prerender   标记到您的模板构建,它将为您处理所有这些。   我们仍在积极地进行这项工作,并希望尽快将其发货。谢谢

Github相关问题:

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

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

答案 1 :(得分:0)

是的,就像Aldarund所说的那样,你不能,我对prerendering page进行了更好的了解,据说那里的prerender发生在构建时间上,所以这不可能:/太糟糕了

答案 2 :(得分:0)

实际上,您有一种解决方法

  1. 您必须以unpkg或任何其他公共(或私有)CDN发布Web组件
  2. 在您的nuxt.config.js文件中,在部分脚本中添加脚本。此脚本必须引用您的公共库(https://stenciljs.com/docs/javascript

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

欢呼