Assets returning 404 in Docker

Hello everyone,

I have a Laravel 9 application with a combination Vue.js and Blade for the frontend, built using Vite. I've dockerized the application using php:8.1-fpm for the PHP container and Nginx for the web server.

Despite the static assets existing in the correct directory inside the Docker container, I'm still getting 404 errors when trying to access them via the browser. Interestingly, the 404 page is being returned by Nginx, not Laravel.

Here's the dockerfile for my Laravel application:

# Stage 1: Build assets
FROM node:20 as asset-builder

WORKDIR /app

COPY package*.json ./
RUN npm install

COPY . .
RUN npm run build --production

# Stage 2: Setup PHP and dependencies
FROM php:8.1-fpm

WORKDIR /var/www/html

RUN apt-get update && apt-get install -y \
    supervisor \
    libzip-dev \
    && docker-php-ext-install pdo pdo_mysql zip

RUN curl -sS https://getcomposer.org/installer | php -- --install-dir=/usr/local/bin --filename=composer

COPY --from=asset-builder /app .

RUN cp .env.example .env

RUN composer install

RUN chown -R www-data:www-data /var/www/html/storage
RUN chown -R www-data:www-data /var/www/html
RUN chmod -R 775 /var/www/html/storage
RUN chmod -R 775 /var/www/html/bootstrap/cache

CMD php-fpm

This is my Nginx container configuration:

server {
    listen 80;
    index index.php index.html;
    error_log  /var/log/nginx/error.log;
    access_log /var/log/nginx/access.log;
    root /var/www/html/public;

    location / {
        try_files $uri $uri/ /index.php?$query_string;
    }

location /build/assets/ {
    root /var/www/html/public;
    try_files $uri =404;
}

    location ~ \.php$ {
        fastcgi_pass php-fpm:9000;
        fastcgi_index index.php;
        fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
        include fastcgi_params;
    }
}

And here's my docker-compose file:

version: '3'
services:
    php-fpm:
        build:
            context: .
            dockerfile: Dockerfile
#        volumes:
#            - /data/laratest2/public:/var/www/html/storage/public

        networks:
            - app-network

    nginx:
        build:
            context: .
            dockerfile: nginx.dockerfile
        ports:
            - 8000:80
        networks:
            - app-network
        depends_on:
            - php-fpm

    redis:
        image: redis:latest
        ports:
            - 6379:6379
        networks:
            - app-network

networks:
    app-network:
        driver: bridge

The static assets are generated in the Laravel app using the @vite directive, and they reside at /var/www/html/public/build/assets/ inside the Docker container.

All the necessary CSS and JS files exist and are owned by the user and group www-data with permissions -rw-r--r--.

For instance, an example URL that's giving me a 404 is http://127.0.0.1:8000/build/assets/app-d2cf6bcc.css.

I've checked my Nginx and Laravel configurations and can't seem to find the issue. I also tried adding an explicit location block (as seen above) in my Nginx config for serving assets, but to no avail.

I'd appreciate any suggestions or advice on what I might be missing or doing wrong. Thank you!