Docker Registry and Docker images of your project

All images generated in the build process are stored in our Docker Registry (opens new window). Access to the registry is limited only for the Vue Storefront Cloud users. Registry is available under address registry.vuestorefront.cloud.

By default images are tagged by git hash, ex: registry.vuestorefront.cloud/demo-storefrontcloud-io/vue-storefront:dc7b0af2. If you want images tagged by git tags, ex: registry.vuestorefront.cloud/demo-storefrontcloud-io/vue-storefront:1.2.3 and trigger the deployment on tag push, you will need to customize the default deployment workflow a bit:

deploy-vue-storefront-cloud.yml:

on:
  push:
    branches:
      - main
    tags:
      - '[0-9]+.[0-9]+.[0-9]+'

jobs:
    ...
      - name: Build and publish docker image
        uses: elgohr/Publish-Docker-Github-Action@v5
        with:
          name: ${{ secrets.PROJECT_NAME }}-storefrontcloud-io/vue-storefront:$([[ ${{ github.ref_type }} == "tag" ]] && printf ${{ github.ref_name }} || printf ${{ github.sha }})
          registry: ${{ secrets.DOCKER_REGISTRY_URL || 'registry.vuestorefront.cloud' }}
          username: ${{ secrets.CLOUD_USERNAME }}
          password: ${{ secrets.CLOUD_PASSWORD }}
          dockerfile: .vuestorefrontcloud/docker/Dockerfile
          buildoptions: "--compress"
    ...

As Vue Storefront Cloud is GitHub based and we officially support GitHub Actions, the default deployment pipeline will be a github workflows yaml configuration file.

Other CI/CD's

If you'd like to use some other CI/CD solution, you will need to customize the build process to achieve the same or similar result. Here is the example build step for gitlab CI:

.gitlab-ci.yml:

  script:
    - echo "{\"auths\":{\"$REGISTRY_URL\":{\"username\":\"$REGISTRY_USER\",\"password\":\"$REGISTRY_PASSWORD\"}}}" > /kaniko/.docker/config.json
    - TAG=${CI_COMMIT_SHA:0:8}
    - if [ -n "$CI_COMMIT_TAG" ]; then TAG=$CI_COMMIT_TAG; fi
    - /kaniko/executor --context $CI_PROJECT_DIR --dockerfile $CI_PROJECT_DIR/dev/docker/Dockerfile --destination $REGISTRY_IMAGE:$TAG

Docker image customization

Docker images used in your instance are ready to use and you do not require any customization - however you can tune it up according to your needs.

Dockerfile location

Dockerfile is stored in .vuestorefrontclud/docker/Dockerfile directory.

Application port

If you use custom docker image for Vue Storefront remember that the application should listen on port 3000 - other kubernetes objects rely on the application to listen on that port.