如何启用SAP Spartacus服务器端渲染模式

蜗牛 互联网技术资讯 2021-12-08 244 0

本篇文章为大家展示了如何启用SAP Spartacus服务器端渲染模式,内容简明扼要并且容易理解,绝对能使你眼前一亮,通过这篇文章的详细介绍希望你能有所收获。

在Spartacus中,服务器端呈现允许您在服务器端呈现页面的静态版本。这加快了响应时间,有助于SEO,并允许应用程序更快地渲染。Angular启动后,您站点的用户将获得完整的体验。

服务器端渲染页面的静态版本。服务器端渲染(Server Side Rendering,SSR)加快了应用的响应速度,有助于页面SEO-搜索引擎优化。

如何启用Spartacus SSR

向Spartacus应用程序添加SSR支持的推荐方法是使用schematics。只需一个命令,所有必需的文件就会自动添加,所有SSR支持的修改也会自动完成。要向Spartacus应用程序添加SSR支持,请运行以下命令:

ng add @spartacus/schematics --ssr

Installation Steps for Spartacus Development

设置environment.prod.ts里的occBaseUrl:

如何启用SAP Spartacus服务器端渲染模式  sap spartacus 第1张

关掉PWA:

一旦Spartacus以PWA模式安装,就会安装一个服务工作者,它将与js文件一起提供index.html的缓存版本。这导致SSR被完全跳过。以下步骤描述了如何关闭PWA。

app.module.ts里,关闭pwa:

如何启用SAP Spartacus服务器端渲染模式  sap spartacus 第2张

yarn build:core:lib

如何启用SAP Spartacus服务器端渲染模式  sap spartacus 第3张

building Angular package

如何启用SAP Spartacus服务器端渲染模式  sap spartacus 第4张

Compiling TypeScript sources through ngc

Bundling to FESM2015

Spartacus/core built完毕
Angular package built完毕

built输出位于projects/core和dist/core文件夹下面:

如何启用SAP Spartacus服务器端渲染模式  sap spartacus 第5张

storefrontlib build完毕:

如何启用SAP Spartacus服务器端渲染模式  sap spartacus 第6张

organization/Administration/core built完毕:

如何启用SAP Spartacus服务器端渲染模式  sap spartacus 第7张

总共花费400秒

如何启用SAP Spartacus服务器端渲染模式  sap spartacus 第8张

然后:Build your local Spartacus shell app by running the following command:

yarn build --prod

实际上执行的命令是:

ng build storefrontapp --prod --prod

如何启用SAP Spartacus服务器端渲染模式  sap spartacus 第9张
如何启用SAP Spartacus服务器端渲染模式  sap spartacus 第10张

总共花费215秒:

如何启用SAP Spartacus服务器端渲染模式  sap spartacus 第11张

Build the SSR version of your shell app by running the following command:

yarn build:ssr

72秒结束:

如何启用SAP Spartacus服务器端渲染模式  sap spartacus 第12张

最后一个步骤:
yarn serve:ssr
如何启用SAP Spartacus服务器端渲染模式  sap spartacus 第13张

原来是用的node express server

上述内容就是如何启用SAP Spartacus服务器端渲染模式,你们学到知识或技能了吗?如果还想学到更多技能或者丰富自己的知识储备,欢迎关注蜗牛博客行业资讯频道。

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:niceseo99@gmail.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

评论

有免费节点资源,我们会通知你!加入纸飞机订阅群

×
天气预报查看日历分享网页手机扫码留言评论Telegram