Error: Bind mount must start with ${WEBAPP_STORAGE_HOME}

Greetings,

I'm trying to build an azure web app using docker-compose. To set the context, I'm trying to deploy a multi-container that has Flask and React (React for the front end and Flask for the back end). The docker-compose file looks like below. I'm getting the following error in the logs when configuring in the deployment center. Please help me with a solution.

docker-compose.yml

version: '3'

services:
api:
build: api
image: <acruser>.azurecr.io/containergroup:app-flask
command: ["flask", "run", "--host=0.0.0.0"]
volumes:
- ./api:/backend
environment:
- FLASK_ENV=development
- FLASK_APP=flask_app.py
ports:
- "5000:5000"

client:
build: client
image: <acruser>.azurecr.io/containergroup:app-react
command: ["npm", "start"]
volumes:
- ./client:/frontend

environment:
- NODE_ENV=development
ports:
- '3000:3000'
depends_on:
- api

Error:

ERROR - Exception in multi-container config parsing: YamlException: (Line: 11, Col: 9, Idx: 175) - (Line: 11, Col: 23, Idx: 189): Bind mount must start with ${WEBAPP_STORAGE_HOME}.