如何在 SAP Commerce Cloud Portal 构建和部署 SAP Spartacus Storefront

Posted 2021-10-02 JerryWangSAP

Commerce Cloud portal：

CCV2 部署包含构建和部署两个子步骤。

首先登录 cloud portal，创建一个新 build：

点击 create 按钮：

输入构建的名称和托管要构建的代码库的 git 分支。名称只是一个标签，但是，我们按照惯例使用名称是为了更容易了解构建包含的内容。约定如下：

spartacus-[hybris_patch_version]-[cep_version]-[spartacus_version].[build_number]
hybris_patch_version: Version of hybris and patch level (e.g. 1905.13)
cep_version: Cloud extension pack version suffix (e.g. 2004)
spartacus_version: Built version of Spartacus (e.g. 1.5.3)
build_number: A consecutive number (1, 2, 3...)

Example: spartacus-1905.13-cep-2004-1.5.3.0

Git 分支或标签字段是指将用于构建的 git repo 分支或标签。 目前我们使用 spa/1.5.3 分支。

单击保存。 这将安排并启动构建。 构建完成后，可以部署在 CCv2 实例中。

从 build list 里选择完成的 build，点击 Deploy to Environment 即可。

选择要部署的目标环境。

对于数据迁移模式，如果数据不打算作为部署的一部分进行更改，则不需要迁移。 如果数据会发生变化，请初始化数据库。

Dynamic properties

有一些属性是和 environment 相关的，例如：

{
"key": "website.electronics.http",
"value": "http://storefront.d3-public.model-t.cc.commerce.ondemand.com/yacceleratorstorefront"
},
{
"key": "website.electronics.https",
"value": "https://storefront.d3-public.model-t.cc.commerce.ondemand.com/yacceleratorstorefront"
},
{
"key": "website.electronics-spa.http",
"value": "http://storefront.d3-public.model-t.cc.commerce.ondemand.com:4200"
},
{
"key": "website.electronics.https",
"value": "https://storefront.d3-public.model-t.cc.commerce.ondemand.com:4200"
},
{
"key": "sop.post.url",
"value": "https://storefront.d3-public.model-t.cc.commerce.ondemand.com/acceleratorservices/sop-mock/process"
}

有几种方法可以在每个环境中指定这些属性，这样我们就不必进行多次构建。

(1) Use magic properties that start with "ccv2.services" (website.electronics.https=${ccv2.services.accstorefront.url.0})
(2) Place your host-specific properties under the hcs_common service on the given instance

(Environments > your_environment > Services > hcs_common > Properties)

Deploying a javascript storefront

Model T 需要 Github 仓库具有上图所示的文件结构。

(1) core-customize 将包含您自定义的扩展和 manifest.json 来描述您的环境。
(2) js-storefront 将包含 Storefront 代码和前端的清单。 下面是一个例子：

{
  "applications": [
      {
          "name": "spartacus",
          "path": "spartacus",
          "enableSSR": "true", //if you want to enable SSR
          "nodeVersion": "11"  //if you want a specific node version
      }
  ]
}

在幕后，Model T builder 将：

(1) 在 application.path 文件夹下查找 dist 文件夹。 如果它在那里，它会将它部署在一个节点中。
(2) 如果没有 dist 文件夹，它将构建和部署您的店面代码，该代码应位于 application.path 文件夹中

Backend URL for javascript storefront

如果您有多个环境并且您想重用相同的构建，请在 index.html 中添加一个属性，如下所示：

<meta name="occ-backend-base-url" content="OCC_BACKEND_BASE_URL_VALUE" />

Model T builder 将自动用每个环境的正确后端 URL 替换元属性的内容。

如果启用 PWA，则必须在本地构建应用程序，然后部署到 CCv2 以便正确创建 Service Worker。 （如果将构建委托给 Model T，则不会正确创建 Service Worker）

更多Jerry的原创文章，尽在："汪子熙":