1

I've been struggling with a situation for the past day, and I couldn't really find anything that helped me solve it:

I have a Svelte + Flask project that I've been running directly on my host for a while, but I've recently decided to dockerize both the frontend and backend service into the same container.

Now, when developing the frontend part, I used npm run dev to start the frontend service and have it reload every time I made changes to the code. Problem is, when I run the same thing inside the container nothing happens when I update the code. I do know for sure that code I write on the host gets put into the container using the volume defined in the docker-compose.

I'm honestly pretty new to containerization in general, so I wouldn't be surprised if it is something I missed.

For reference, here's my Dockerfile:

FROM nikolaik/python-nodejs:python3.9-nodejs16-slim

WORKDIR /opt/myproject

COPY . .

RUN pip3 install -r server/requirements.txt
RUN cd client && npm install && npm run-script build

EXPOSE 5000
ENV FLASK_ENV="development"
ENV FLASK_APP="/opt/myproject/server/src/start.py"

CMD ["/bin/sh", "/opt/myproject/start_services.sh"]

I've made a script to run both Gunicorn on backend in addition to npm run dev:

#!/bin/sh
cd /opt/myproject/server/src
gunicorn --bind 0.0.0.0:5000 --reload --daemon start:app 
cd /opt/myproject/client
npm run dev

Here's my compose, if it is also needed:

# docker-compose.yml
version: '3.9'

services:
  web:
    image: myproject_main
    container_name: myproject_main_container
    ports:
     - "5000:5000"
    dns:
     - 8.8.8.8
    volumes:
     - ./myproject_code:/opt/myproject
  


networks:
  default:
    external: true
    name: myproject_net

Thanks a lot!

Improve this question
9
  • 1
    its not really about your issue, but you should probably not put your frontend and flask in the same container. For dev, use a node image or develop locally, and for prod put the statics in a nginx image for example.
    – The Fool
    Commented Nov 30, 2021 at 19:03
  • 1
    I dont have an answer for your question, but i wanted to point out that docker is intended to best mimic your production environment. Meaning its not the best suited tool to debug your app. I would recommend testing both sides of the app local. Then when both are solid run the container and see if the app behaves as expected. Deploy the image to your environment. I think what youre asking can be done. I've never seen it done tho.
    – Leonardo Wildt
    Commented Nov 30, 2021 at 19:03
  • 1
    Gotta be honest with you, you are prob right, but right now it's mostly a learning experience from me so I kinda cut corners there
    – Lior Dahan
    Commented Nov 30, 2021 at 19:04
  • You only expose one port. How do you indent to see the frontend while it's hot reloading? Looks to me like you built the statics once at image build time and let flask serve them. That way, flask wouldn't see what your svelte dev server is doing, unless its compiling the project into statics and puts them into flasks statics dir.
    – The Fool
    Commented Nov 30, 2021 at 19:21
  • @TheFool I have Flask running on 5000 and npm takes a random port since 5000 is occupied, but AFAIK npm rebuilds the pages itself when it's running regardless of what Flask is seeing, and Flask just referenced the built pages. I don't really rely on Flask to reload whenever frontend changes are detected
    – Lior Dahan
    Commented Nov 30, 2021 at 19:27
Related questions
0
Developing NodeJS app using Docker with live reload
11
Docker: reload a nodejs app with nodemon
0
Live reload Node.js dev environment with Docker
Load 7 more related questions Show fewer related questions

0

Reset to default

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.