BryonLewis
commented
1 year ago During the build process for the girder container the Application is copied from the repository in the ./client directory and yarn build:web is run to create the Vue application in a /dist directory.
https://github.com/Kitware/dive/blob/main/docker/girder.Dockerfile#L7-L13
That build is copied into the Girder static directory where it is served as the main application behind the default route for girder: https://github.com/Kitware/dive/blob/main/docker/girder.Dockerfile#L63
So if you change files in the ./client directory and then run docker-compose build followed by docker-compose up the container will have a new build of the WebUI.
A better way to do client development is to navigate to the /client directory in the repository. Run yarn to install all of the dependencies and then yarn serve to bring up the application at localhost:8080. If you have done docker-compose up the built container will run at localhost:8010. Now using yarn serve you can edit files and it will hot-reload the webUI in real-time. When you're done editing the UI you can run docker-compose build and next time the the containers are launched the changes will be included in the UI.
adam-zakaria
Hello!
I am running DIVE locally using the docker compose from here https://kitware.github.io/dive/Deployment-Docker-Compose/
I want to modify the Web UI but cannot figure out how.
Some things I’ve tried: I cannot find the client folder of vue files in any of the containers. I cannot figure out how Traefik is routing traffic: I understand it’s mapping 80 inside the container to 8010 outside the container, but I do not see where the web server is actually running. I say this all to demonstrate I’ve been trying to figure it out.
Any help is appreciated :)