I’m successfully using Okteto for my legacy vanilla PHP app. We’re working on reimplementing our app from scratch in Laravel, and I’m trying to figure out the best way to develop it in Okteto. The issue I’m running into is how to set up and run the web server/frontend.
In my production web server container, I’d like to avoid having npm installed, so my Dockerfile is running npm build in order to compile the static files, and then copying them into the container:
FROM node:21 as frontend
ARG APP_PATH
ARG DEV_ENVIRONMENT
COPY --from=composer_base "$APP_PATH" "$APP_PATH"
WORKDIR "$APP_PATH"
RUN npm install && \
npm run build
###############################
FROM nginx:1.25-alpine as web_server
ARG APP_PATH
ARG DEV_ENVIRONMENT
ENV APP_PATH="$APP_PATH"
WORKDIR "$APP_PATH"
COPY docker/web_server/nginx.conf.template /etc/nginx/templates/default.conf.template
COPY --from=frontend "${APP_PATH}/public" "${APP_PATH}/public"
This way, in production, the intention is to just run the web_server image, which will serve the statically compiled assets.
For local development, my docker-compose.yml file runs both the web_server image and also the frontend image with an overridden command, to run npm run dev and run the vite dev server for hot module reloading:
# ...
xiam.web:
build:
context: .
target: web_server
args:
DEV_ENVIRONMENT: true
image: xiam/web_server:develop
container_name: xiam-web
ports:
- '${APP_PORT:-80}:80'
environment:
FPM_HOST: "xiam-fpm:9000"
volumes:
- './public:/app/public'
networks:
- xiam
depends_on:
- xiam.fpm
- xiam.frontend
xiam.frontend:
build:
context: .
target: frontend
args:
DEV_ENVIRONMENT: true
image: xiam/frontend:develop
container_name: xiam-frontend
command: [ "npm", "run", "dev" ]
ports:
- '${VITE_PORT:-5173}:${VITE_PORT:-5173}'
volumes:
- '.:/app'
- '/app/node_modules/'
networks:
- xiam
# ...
Both of these are working. However, now I’m trying to build my Okteto manifest to get remote development working in my self-hosted Okteto cluster, and I’m not sure how to achieve the same thing as I’m doing locally in docker compose.
I was hoping for some insight from you guys, since Laravel and Vite are also pretty new for me, so I’m not clear on how this should be configured. It looks like Vite detects that there is a dev server running by looking for a file named hot in the public directory on the web server container. My first thought was to add a second container to the web_server Deployment to run the frontend image with the npm run dev command. If I could sync both containers back to my local machine, the hot file should be synced into the web_server container. But based on an earlier discussion thread I found, it looks like Okteto doesn’t support running okteto up to multiple containers in the single pod, so that doesn’t seem like a workable solution.
I have some other ideas about other possible approaches, but I was curious if someone with more Laravel/Vite experience might be able to offer some insight. Thanks!
