Laravel 9 with Docker - CSS and JS not loading using Vite - laravel

I'm having trouble in determining the cause of not loading of my CSS stylesheet and Javascript on my Laravel 9 project using Docker in my Windows OS.
I have done all the steps after creating containers and no error message thrown in my page.
Should I run npm run dev in the container? I have no issue before using mix but I really need to deploy this project.
I also attached screenshot below from chrome dev tools that everything in my app.js & app.css is not loading
Dockerfile:
# Set master image
FROM php:8.0-fpm
# Arguments defined in docker-compose.yml
ARG user
ARG uid
# Install system dependencies
RUN apt-get update && apt-get install -y \
git \
curl \
libpng-dev \
libonig-dev \
libxml2-dev \
zip \
unzip
# Clear cache
RUN apt-get clean && rm -rf /var/lib/apt/lists/*
# Install PHP extensions
RUN docker-php-ext-install pdo_mysql mbstring exif pcntl bcmath gd
# Get latest Composer
COPY --from=composer:latest /usr/bin/composer /usr/bin/composer
# Create system user to run Composer and Artisan Commands
RUN chown -R www-data:www-data /var/www
# Set working directory
WORKDIR /var/www
USER $user
docker-compose.yml
version: '3'
services:
#Laravel App
app:
build:
context: .
dockerfile: Dockerfile
image: dr3
container_name: app
volumes:
- .:/var/www/
ports:
- "9000:9000"
networks:
- laraveldockerize
#Nginx Service
nginx:
image: nginx:stable-alpine
container_name: nginx
restart: unless-stopped
ports:
- "8000:80"
volumes:
- .:/var/www
- ./dockerize/nginx/default.conf:/etc/nginx/conf.d/default.conf
networks:
- laraveldockerize
#MySQL Service
db:
image: mysql:5.7
container_name: db
restart: unless-stopped
tty: true
ports:
- "3306:3306"
environment:
MYSQL_DATABASE: ${DB_DATABASE}
# MYSQL_USER: ${DB_USERNAME}
MYSQL_PASSWORD: ${DB_PASSWORD}
MYSQL_ROOT_PASSWORD: ${DB_PASSWORD}
volumes:
- ./dockerize/mysql/data:/var/lib/mysql
- ./dockerize/mysql/my.cnf:/etc/mysql/conf.d/mysql-custom.cnf
networks:
- laraveldockerize
node:
image: node:alpine
container_name: node
working_dir: /var/www/
tty: true
ports:
- 5173:5173
volumes:
- ./:/var/www
networks:
- laraveldockerize
#Docker Networks
networks:
laraveldockerize:
driver: bridge
Vite:

Related

Docker-compose run script after container starts

My goal is to have a one-liner (kinda) for building and starting my app. I want to be able to execute this command and run several additional commands related to my app (like migrations, init and starting a websocket server).
But when I try to use ENTRYPOINT directive my php service runs commands but the service itself is not working properly.
docker log nginx shows me this error:
[error] 31#31: *2 connect() failed (111: Connection refused) while connecting to upstream,
If I comment out ENTRYPOINT in back.dockerfile my app runs fine, but I have to manually run those artisan commands
docker-compose build && docker-compose up -d
Is there a way to achieve such result?
My docker-compose.yml
networks:
laravel:
services:
nginx:
image: nginx:stable-alpine
container_name: nginx
volumes:
- ./app:/var/www/html
- ./nginx/default.conf:/etc/nginx/conf.d/default.conf
ports:
- "8000:80"
depends_on:
- php
- mysql
networks:
- laravel
tty: true
php:
build:
context: .
dockerfile: ./docker/back.dockerfile
container_name: php
ports:
- "9000:9000"
depends_on:
- node
networks:
- laravel
node:
build:
context: .
dockerfile: ./docker/front.dockerfile
container_name: node
ports:
- "3000:3000"
networks:
- laravel
mysql:
image: mysql:8.0
container_name: mysql
restart: unless-stopped
ports:
- "3306:3306"
volumes:
- ./mysql:/var/lib/mysql
environment:
MYSQL_DATABASE: laravel
MYSQL_USER: laravel
MYSQL_PASSWORD: laravel
MYSQL_ROOT_PASSWORD: root
SERVICE_NAME: mysql
networks:
- laravel
back.dockerfile
FROM php:7.4-fpm-alpine
RUN docker-php-ext-install pdo pdo_mysql
RUN php -r "readfile('http://getcomposer.org/installer');" | php -- --install-dir=/usr/bin/ --filename=composer
RUN apk update
RUN apk upgrade
RUN apk add bash
RUN alias composer='php /usr/bin/composer'
ENV COMPOSER_ALLOW_SUPERUSER 1
COPY ./app/composer.json ./app/composer.lock ./
COPY ./app .
RUN composer install --no-scripts --prefer-dist --optimize-autoloader
RUN chown -R www-data:www-data /var/www/html
RUN chmod -R 755 /var/www/html/storage
COPY ./entrypoint.sh /entrypoint.sh
ENTRYPOINT ["/entrypoint.sh"]
EXPOSE 6001
entrypoint.sh
#!/bin/sh
set -e
php artisan migrate --path 'database/migrations'
php artisan app:init
php artisan websockets:serve
exec "$#"

Docker container called in Laravel

How do I call a docker container within Laravel? I am using the following package to download PDFs https://packagist.org/packages/spatie/browsershot, I have an npm container which I am trying to use with this package.
My site container doesn't have node or npm installed which is why I need to use my npm container instead.
Here is my docker file
version: '3'
networks:
laravel:
services:
site:
build:
context: .
dockerfile: docker/nginx/Dockerfile
container_name: nginx
ports:
- 80:80
volumes:
- ./src:/var/www/html:delegated
depends_on:
- php
- mysql
networks:
- laravel
mysql:
image: mysql:5.7.29
container_name: mysql
restart: unless-stopped
tty: true
ports:
- 3306:3306
environment:
MYSQL_DATABASE: odc
MYSQL_USER: admin
MYSQL_PASSWORD: ".d3aP/7N,c)&^EdC"
MYSQL_ROOT_PASSWORD: "%3h_Ssxm7sSj#bw!"
SERVICE_TAGS: dev
SERVICE_NAME: mysql
networks:
- laravel
php:
build:
context: .
dockerfile: docker/php/Dockerfile
container_name: php
volumes:
- ./src:/var/www/html:delegated
networks:
- laravel
composer:
build:
context: .
dockerfile: docker/composer/Dockerfile
container_name: composer
volumes:
- ./src:/var/www/html
working_dir: /var/www/html
depends_on:
- php
user: laravel
entrypoint: ['composer', '--ignore-platform-reqs']
networks:
- laravel
npm:
image: node:13.7
container_name: npm
volumes:
- ./src:/var/www/html
working_dir: /var/www/html
entrypoint: ['npm']
networks:
- laravel
chrome:
image: zenika/alpine-chrome:latest
container_name: headless-chrome
networks:
- laravel
command: [chromium-browser, "--headless", "--disable-gpu", "--no-sandbox", "--remote-debugging-address=0.0.0.0", "--remote-debugging-port=9222"]
Here is the code I am trying to use with Browsershot to point to my npm container
Browsershot::html($html)
->setIncludePath('npm')
->setNodeModulePath("npm")
->setChromePath('chrome')
->noSandbox()
->showBackground()
->format('A4')
->savePdf($path . '/portrait.pdf');
As you can see I am using the ->setIncludePath('npm') to try and call my npm container but I am still receiving this error when I try and run this code
sh: npm: not found sh: node: not found
You dont need a seperate Node / NPM Container. The Browsershot is part of your applications core. To make it work you need nodejs and npm. That saying I would construct my own container image incuding PHP and Node. That makes the implementation of Browershot more simple.
If neede you can split them up later. But in that case I would create a new BrowserShot service (PHP + Node).
As you can see, there are multiple ways doing it.
What about using NGINX Unit for your applications container base? You could use the Unit PHP base image and add node on top of it.
I did that here:
https://github.com/nginx/unit-examples/blob/master/Dockerfile
FROM nginx/unit:1.22.0-php7.3
RUN mkdir /var/apphome/ && groupadd -r appuser && useradd --no-log-init -r -g appuser appuser && \
chown -R appuser:appuser /var/apphome/ && \
apt-get update && apt-get install --no-install-recommends --no-install-suggests -y gnupg && \
curl -sL https://nginx.org/keys/nginx_signing.key | apt-key add - && \
echo "deb https://packages.nginx.org/unit/debian/ buster unit" >> /etc/apt/sources.list.d/unit.list && \
echo "deb-src https://packages.nginx.org/unit/debian/ buster unit" >> /etc/apt/sources.list.d/unit.list && \
apt update && apt install -y unit-dev npm php7.3-mysql php7.3-gd && \
npm install -g --unsafe-perm unit-http -y
COPY src/ /var/apphome/app/
RUN chown -R appuser:appuser /var/apphome/
COPY .unit.conf.json /docker-entrypoint.d/.unit.conf.json
CMD ["unitd", "--no-daemon", "--control", "unix:/var/run/control.unit.sock"]
Note! This is a demo purpose. You can adapt it for your production needs!

Why is my Docker volume only sharing the docker-compose file?

I am trying to containerize a Laravel application using Docker Compose, but I am failing to use a shared volume to bring in my actual project app files. My docker-compose file looks like this:
version: "3.7"
services:
app:
build:
args:
user: sam
uid: 1000
context: ./
dockerfile: Dockerfile
image: converter
container_name: converter-app
restart: unless-stopped
working_dir: /var/www/
volumes:
- ./:/var/www
networks:
- converter
db:
image: mysql:5.7
container_name: converter-db
restart: unless-stopped
environment:
MYSQL_DATABASE: ${DB_DATABASE}
MYSQL_ROOT_PASSWORD: ${DB_PASSWORD}
MYSQL_PASSWORD: ${DB_PASSWORD}
MYSQL_USER: ${DB_USERNAME}
SERVICE_TAGS: dev
SERVICE_NAME: mysql
volumes:
- ./docker-compose/mysql:/docker-entrypoint-initdb.d
networks:
- converter
nginx:
image: nginx:alpine
container_name: converter-nginx
restart: unless-stopped
ports:
- 8000:80
volumes:
- ./:/var/www
- ./docker-compose/nginx:/etc/nginx/conf.d/
networks:
- converter
networks:
converter:
driver: bridge
volumes:
app-volume:
and the Dockerfile for the app service:
FROM php:7.4-fpm
# Arguments defined in docker-compose.yml
ARG user
ARG uid
# Install system dependencies
RUN apt-get update && apt-get install -y \
git \
curl \
libpng-dev \
libonig-dev \
libxml2-dev \
zip \
unzip
# Clear cache
RUN apt-get clean && rm -rf /var/lib/apt/lists/*
# Install PHP extensions
RUN docker-php-ext-install pdo_mysql mbstring exif pcntl bcmath gd
# Get latest Composer
#RUN curl -sS https://getcomposer.org/installer | php -- --install-dir=/usr/local/bin --filename=composer
# Create system user to run Composer and Artisan Commands
RUN useradd -G www-data,root -u $uid -d /home/$user $user
RUN mkdir -p /home/$user/.composer && \
chown -R $user:$user /home/$user
# Set working directory
WORKDIR /var/www
USER $user
I then run docker-compose build app and docker-compose up -d to create the containers, which brings them up. When I go to check the /var/www folder of the app container using docker-compose exec app ls -l, the only file that shows is the docker-compose file:
Shouldn't the shared volume specified for the app service share my working directory in the app /var/www folder?
You need to add these config options to the app service in compose file:
links:
- nginx
depends_on:
- nginx
These options forces docker-compose to create 1st the nginx service, and after the app, this is neccessary becuse currently nginx is created after app, and nging overwrite the /var/www directory

ERROR: Service 'php_fpm' failed to build: unexpected EOF

so I'm currenty using docker in my laravel+vue.js project and whenever I try to run docker-compose up --build -d this error appears
ERROR: Service 'php_fpm' failed to build: unexpected EOF
This my docker-compose.yml code
version: "3.5"
services:
php_fpm:
build:
context: .
dockerfile: ./docker/php/Dockerfile
container_name: app_php_fpm
working_dir: ${NGINGX_ROOT}
networks:
- app
volumes:
- ./:${NGINGX_ROOT}
nginx:
image: nginx:1.15
container_name: app_nginx
working_dir: ${NGINGX_ROOT}
networks:
- app
ports:
- "81:80"
volumes:
- ./:${NGINGX_ROOT}
- ./docker/nginx/conf.d/default.conf:/etc/nginx/conf.d/default.conf
db:
image: mariadb:latest
container_name: app_db
networks:
- app
environment:
- MYSQL_DATABASE=pfe
- MYSQL_ROOT_PASSWORD=
- MYSQL_USER=root
- MYSQL_PASSWORD=
redis:
image: redis:latest
container_name: app_redis
networks:
- app
ports:
- "6382:6379"
composer:
image: composer:latest
working_dir: ${NGINGX_ROOT}
command: install
volumes:
- ./:${NGINGX_ROOT}
node:
build:
context: .
dockerfile: ./docker/npm/Dockerfile
container_name: app_npm
working_dir: ${NGINGX_ROOT}
volumes:
- ./:${NGINGX_ROOT}
networks:
app:
driver: bridge
I've checked many forums looking for solutions but none of them seemed to solve my problem. I would really appreciate your help.
PS : I'm using php version 7.1.28 and docker version : 18.09.2
This is my docker file
FROM php:7.2-fpm
RUN apt-get update && apt-get install -y \
curl \
git \
libzip-dev \
zip \
unzip
RUN docker-php-ext-configure zip --with-libzip
RUN docker-php-ext-install pdo_mysql zip
RUN curl --silent --show-error https://getcomposer.org/installer | php && \
mv composer.phar /usr/local/bin/composer

Docker Laravel not loading assets

I have configure a docker compose file to run laravel with apache and mysql. The app builds fine but when i access to it i have this error loading the assets
This is my docker-compose file conf:
version: '3'
services:
#PHP Service
vma_web:
build:
context: .
dockerfile: Dockerfile
container_name: vma_web
restart: unless-stopped
env_file: '.env.prod'
tty: true
ports:
- "8250:80"
environment:
SERVICE_NAME: vma_web
SERVICE_TAGS: 1.0.0
networks:
- app-network
#MySQL Service
vma_mysql:
image: mysql:5.7
container_name: vma_mysql
restart: unless-stopped
tty: true
ports:
- "33061:3306"
environment:
MYSQL_DATABASE: school_back
MYSQL_ROOT_PASSWORD: epTfkgH9XakwN5mm
SERVICE_TAGS: 1.0.0
SERVICE_NAME: vma_mysql
networks:
- app-network
#Docker Networks
networks:
app-network:
driver: bridge
And the dockerfile
FROM php:7.2-apache-stretch
RUN apt-get update
RUN apt-get install -y libpng-dev libxml2-dev nano zip unzip
RUN docker-php-ext-install mbstring gd zip pdo pdo_mysql
COPY vma.conf /etc/apache2/sites-available/000-default.conf
WORKDIR /var/www/html/vma
COPY . .
RUN curl -sS https://getcomposer.org/installer | php
RUN mv composer.phar /usr/local/bin/composer
RUN chmod -R 777 bootstrap storage public routes/pages.php
RUN composer install
EXPOSE 80
What am i doing wrong ?
is something about permissions ?
is something about the ports ?

Resources