HTTPS with traefik, docker compose and vue+nginx app showing 404

Newby dev here deploying my first full stack project.

Im trying to run a vuejs+nginx client app in a docker-compose file with mysql, a nodejs backend and traefik to handle https.

With traefik running I am able to reach the app unsecured at http://my.domain.com:8000.

When I go to https://my.domain.com it shows a 404 error unsecured with the TRAEFIK DEFAULT CERT as the invalid certificate

https://my.domain.com:8000 gives "This site cannot provide a secure connection"

No errors are shown from the traefik container in the console

Any help getting the app to show in https is greatly appreciated

Docker Compose:

version: '3.8'
services:
  traefik:
    image: 'traefik:2.4'
    restart: always
    networks:
      - app-network
    ports:
      - '80:80'
      - '443:443'
      - '8080:8080'
    command:
      - '--api.insecure=true'
      - '--providers.docker=true'
      - '--providers.docker.exposedbydefault=false'
      - '--docker --docker.domain=my.domain.com'
    volumes:
      - '/var/run/docker.sock:/var/run/docker.sock'
      - ./traefik.toml:/traefik.toml
      - ./acme.json:/acme.json

  node:
    build:
      context: .
      dockerfile: 'Dockerfile'
    depends_on:
      - db
    networks:
      - app-network
    environment:
      - MYSQL_HOST=db
      - MYSQL_PASSWORD=password
      - MYSQL_USER=user
      - MYSQL_DB=mysqldb
    ports:
      - '3000:3000'
    volumes:
      - './www/:/var/www/html/'
    container_name: nodejsapp
    restart: always

  db:
    image: 'mysql:5.7'
    ports:
      - '3306:3306'
    networks:
      - app-network
    environment:
      - MYSQL_DATABASE=mysqldb
      - MYSQL_USER=user
      - MYSQL_PASSWORD=password
      - MYSQL_ROOT_PASSWORD=password
    volumes:
      - db-data:/var/lib/mysql
    container_name: db
    restart: always

  client:
    build:
      context: ../../client/imagedir
      dockerfile: 'Dockerfile'
    depends_on:
      - node
    ports:
      - '8000:80'
    labels:
      - 'traefik.enable=true'
      - 'traefik.http.routers.client.tls.certresolver=myresolver'
      - 'traefik.http.routers.client.secure.tls=true'
      - 'traefik.http.routers.client.rule=Host(`my.domain.com`,`www.my.domain.com`)'
    container_name: client
    restart: always

volumes:
  db-data:
networks:
  app-network:

traefik.toml

#Traefik Global Configuration
debug = true
checkNewVersion = true
logLevel = "ERROR"
 


#Define the HTTP port 80 and
#HTTPS port 443 EntryPoint
#Enable automatically redirect HTTP to HTTPS
[entryPoints]
[entryPoints.web]
address = ":80"
[entryPoints.web.http.redirections]
      [entryPoints.web.http.redirections.entryPoint]
        to = "websecure"
        scheme = "https"
[entryPoints.websecure]
address = ":443"

[entryPoints.websecure.http.tls]
certResolver = "myresolver"

[entrypoints.client]
address = ":8000"
 

#Define Docker Backend Configuration
[docker]
endpoint = "unix:///var/run/docker.sock"
domain = "domain=my.domain.com"
watch = true
exposedbydefault = false


[http.routers]
  [http.routers.myrouter]
  rule = "Host(`my.domain.com`,`www.my.domain.com`)"
  service = "client"
    [http.routers.myrouter.tls]
      certResolver = "myresolver"

  [http.routers.myroutersec]
  rule = "Host(`my.domain.com`,`www.my.domain.com`)"
  service = "client"

[api]
  dashboard = true
  insecure = true

#Letsencrypt Registration
#Define the Letsencrypt ACME HTTP challenge
[certificatesResolvers.myresolver.acme]
  email = "email@myemail.com"
  storage = "acme.json"
  caServer = "https://acme-staging-v02.api.letsencrypt.org/directory"
  [certificatesResolvers.myresolver.acme.httpChallenge]
    # used during the challenge
    entryPoint = "web"

dockerfile for vue+nginx client

# build stage
FROM node:lts-alpine as build-stage
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
RUN npm run build

# production stage
FROM nginx:1.19.0-alpine as prod-stage
RUN mkdir /app
COPY --from=build-stage /app/dist /usr/share/nginx/html
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

Thanks :)