Nuxt with Docker – websocket connection failed

I am trying to setup docker compose with db and nuxt dev server. For this, I created custom image for nuxt (for db I used mysql image).

When I run docker compose with:

docker compose up -d --build

And open my app on http://localhost:3000 I get errors about websocket connection failure. This error is not causing if I run server on local machine.

Here’s my dev.Dockerfile

# syntax=docker/dockerfile:1.2
FROM node:18.12.1-alpine

WORKDIR /termin.ai/app

# clean npm cache
RUN npm cache clean --force

# build
COPY . /termin.ai

RUN --mount=type=secret,id=_env \ 
npm install && \
npm install @resvg/resvg-js-linux-x64-musl

EXPOSE 3000 4000

# run
CMD ["npm", "run", "dev"]

And here’s docker.compose.yml

version: "3.3"
services:
  mysql:
    image: mysql
    networks:
      - termin_ai
    environment:
      MYSQL_ROOT_PASSWORD: pass
      MYSQL_DATABASE: db
    container_name: app-mysql
    ports:
      - 3306:3306
    volumes:
      - db-data:/var/lib/mysql

  phpmyadmin:
    image: phpmyadmin
    networks:
      - app_network
    ports:
      - 8080:80
    environment:
      - PMA_ARBITRARY=1
  nuxt:
    build: 
      dockerfile: dev.Dockerfile
    networks:
      - app_network
    container_name: app-nuxt
    volumes:
      - ./:/app_folder
      - /app_folder/app/node_modules
      - /app_folder/node_modules
    ports:
      - 3000:3000
      - 4000:4000

volumes:
  db-data:

networks:
  app_network:

I tried to expose both 3000 and 4000 ports but this didn’t work.