Debug Remote Python Flask app in Docker container with VS Code

I’m trying to get into Dockerizing applciations more, but am having difficulty getting debuggers to work. I have a repo for a blogging app here that runs just fine with docker-compose up blog-server and waits for a debugger to attach.

The problem is that after I attach a debugger, anywhere that I place a breakpoint I get a grey circle instead of a red one. When you hover over it, it says that I can’t place a breakpoint on nonexistent file in a tool tip, but it obviously exists. When you docker exec -it into the container and look at the repo itself it’s obvious that it is there.

The goal is to debug remotely into the docker container, so what more is needed to add and hit breakpoints? Thanks for any tips, help, or suggestions

Launch JSON for debugging

{
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Python: Remote Attach",
            "type": "python",
            "request": "attach",
            "connect": {
                "host": "localhost",
                "port": 5678
            },
            "pathMappings": [
                {
                    "localRoot": "${workspaceFolder}",
                    "remoteRoot": "/work"
                }
            ]
        }
    ]
}

Dockerfile:

FROM python:3.8.5-alpine3.12 as base

RUN mkdir /work/
WORKDIR /work/

COPY ./src/requirements.txt /work/requirements.txt
RUN pip install -r requirements.txt

COPY ./src /work/
ENV FLASK_APP=app.py

##### START NEW IMAGE: DEBUGGER #####
FROM base as debug
RUN pip install ptvsd

WORKDIR /work/
CMD python -m ptvsd --host 0.0.0.0 --port 5678 --wait --multiprocess -m flask run -h 0.0.0 -p 5000

##### START NEW IMAGE: PRODUCTION #####
FROM base as prod

CMD flask run -h 0.0.0 -p 5000

Source: Docker Questions