How to configure a vue 3 +Vite app and nginx on docker container

Armani Brown 0
Viewed 59

I am trying to run a vue 3 vite project in docker, i am using nginx to serve the app but this not loading.

Dockerfile

FROM node:lts-alpine as builder

WORKDIR /app

COPY package*.json ./

RUN npm install

COPY . .

RUN npm run build

FROM nginx:stable-alpine as production

COPY ./.nginx/nginx.conf /etc/nginx/nginx.conf

RUN rm -rf /usr/share/nginx/html/*

COPY --from=builder /app/dist /usr/share/nginx/html

EXPOSE 80

CMD ["nginx","-g","daemon off;"]

my nginx config

user  nginx;
worker_processes  1;
error_log  /var/log/nginx/error.log warn;
pid        /var/run/nginx.pid;
events {
  worker_connections  1024;
}
http {
  include       /etc/nginx/mime.types;
  default_type  application/octet-stream;
  log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
                    '$status $body_bytes_sent "$http_referer" '
                    '"$http_user_agent" "$http_x_forwarded_for"';
  access_log  /var/log/nginx/access.log  main;
  sendfile        on;
  keepalive_timeout  65;
  server {
    listen       80;
    server_name  localhost;
    location / {
      root   /app;
      index  index.html;
      try_files $uri $uri/ /index.html;
    }
    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
      root   /usr/share/nginx/html;
    }
  }
}

docker.compose.yml

version: '3.8'

services:
  api:
    build:
     context: .
     target: production
  ports:
    - 3000:80

On running docker compose up this is the result enter image description here

Any reason this happening?

In the terminal this is the output

+] Running 2/2

  • Network new_intranet_default Created 0.1s
  • Container new_intranet-api-1 Created 0.2s Attaching to new_intranet-api-1 new_intranet-api-1 | /docker-entrypoint.sh: /docker-entrypoint.d/ is not empty, will attempt to perform configuration new_intranet-api-1 | /docker-entrypoint.sh: Looking for shell scripts in /docker-entrypoint.d/ new_intranet-api-1 | /docker-entrypoint.sh: Launching /docker-entrypoint.d/10-listen-on-ipv6-by-default.sh new_intranet-api-1 | 10-listen-on-ipv6-by-default.sh: info: Getting the checksum of /etc/nginx/conf.d/default.conf new_intranet-api-1 | 10-listen-on-ipv6-by-default.sh: info: Enabled listen on IPv6 in /etc/nginx/conf.d/default.conf new_intranet-api-1 | /docker-entrypoint.sh: Launching /docker-entrypoint.d/20-envsubst-on-templates.sh new_intranet-api-1 | /docker-entrypoint.sh: Launching /docker-entrypoint.d/30-tune-worker-processes.sh new_intranet-api-1 | /docker-entrypoint.sh: Configuration complete; ready for start up new_intranet-api-1 | 172.18.0.1 - - [18/Sep/2022:15:57:46 +0000] "GET / HTTP/1.1" 200 1250 "-" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-" new_intranet-api-1 | 172.18.0.1 - - [18/Sep/2022:15:57:46 +0000] "GET /assets/index.155e881e.js HTTP/1.1" 200 280036 "http://localhost:3000/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-" new_intranet-api-1 | 172.18.0.1 - - [18/Sep/2022:15:57:46 +0000] "GET /assets/index.192ff113.css HTTP/1.1" 200 42057 "http://localhost:3000/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-" new_intranet-api-1 | 172.18.0.1 - - [18/Sep/2022:15:57:46 +0000] "GET /favicon.ico HTTP/1.1" 200 1250 "http://localhost:3000/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-" new_intranet-api-1 | 172.18.0.1 - - [18/Sep/2022:15:57:46 +0000] "GET /assets/COKSODALITY_LOGO.png HTTP/1.1" 200 97114 "http://localhost:3000/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-" new_intranet-api-1 | 172.18.0.1 - - [18/Sep/2022:15:57:46 +0000] "GET /assets/house2.png HTTP/1.1" 200 26707 "http://localhost:3000/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-" new_intranet-api-1 | 172.18.0.1 - - [18/Sep/2022:15:57:46 +0000] "GET /assets/email.png HTTP/1.1" 200 18175 "http://localhost:3000/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-" new_intranet-api-1 | 172.18.0.1 - - [18/Sep/2022:15:57:46 +0000] "GET /assets/tool-box.png HTTP/1.1" 200 14351 "http://localhost:3000/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-" new_intranet-api-1 | 172.18.0.1 - - [18/Sep/2022:15:57:47 +0000] "GET /assets/document.png HTTP/1.1" 200 6844 "http://localhost:3000/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-" new_intranet-api-1 | 172.18.0.1 - - [18/Sep/2022:15:57:47 +0000] "GET /assets/blogger.png HTTP/1.1" 200 15719 "http://localhost:3000/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-" new_intranet-api-1 | 172.18.0.1 - - [18/Sep/2022:15:57:47 +0000] "GET /assets/about.png HTTP/1.1" 200 27726 "http://localhost:3000/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-" new_intranet-api-1 | 172.18.0.1 - - [18/Sep/2022:15:57:47 +0000] "GET /assets/notice.png HTTP/1.1" 200 16501 "http://localhost:3000/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-" new_intranet-api-1 | 172.18.0.1 - - [18/Sep/2022:15:57:47 +0000] "GET /assets/queue.png HTTP/1.1" 200 6141 "http://localhost:3000/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-" new_intranet-api-1 | 172.18.0.1 - - [18/Sep/2022:15:57:47 +0000] "GET /assets/meeting.png HTTP/1.1" 200 31976 "http://localhost:3000/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-" new_intranet-api-1 | 172.18.0.1 - - [18/Sep/2022:15:57:47 +0000] "GET /assets/conversation.png HTTP/1.1" 200 18276 "http://localhost:3000/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-" new_intranet-api-1 | 172.18.0.1 - - [18/Sep/2022:15:57:47 +0000] "GET /assets/facebook.svg HTTP/1.1" 200 298 "http://localhost:3000/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-" new_intranet-api-1 | 172.18.0.1 - - [18/Sep/2022:15:57:47 +0000] "GET /assets/instagram.svg HTTP/1.1" 200 395 "http://localhost:3000/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-" new_intranet-api-1 | 172.18.0.1 - - [18/Sep/2022:15:57:47 +0000] "GET /assets/linkedin.svg HTTP/1.1" 200 395 "http://localhost:3000/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-" new_intranet-api-1 | 172.18.0.1 - - [18/Sep/2022:15:57:47 +0000] "GET /assets/phone.svg HTTP/1.1" 200 515 "http://localhost:3000/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-" new_intranet-api-1 | 172.18.0.1 - - [18/Sep/2022:15:57:47 +0000] "GET /assets/mail.svg HTTP/1.1" 200 349 "http://localhost:3000/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-" new_intranet-api-1 | 172.18.0.1 - - [18/Sep/2022:15:57:47 +0000] "GET /assets/map-pin.svg HTTP/1.1" 200 317 "http://localhost:3000/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-" new_intranet-api-1 | 172.18.0.1 - - [18/Sep/2022:15:57:47 +0000] "GET /assets/Carousel_Component.1e4ba911.js HTTP/1.1" 200 8859 "-" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-" new_intranet-api-1 | 172.18.0.1 - - [18/Sep/2022:15:57:47 +0000] "GET /assets/twitter.svg HTTP/1.1" 200 403 "http://localhost:3000/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-" new_intranet-api-1 | 172.18.0.1 - - [18/Sep/2022:15:57:47 +0000] "GET /assets/Carousel_Component.22f1373e.css HTTP/1.1" 200 1831 "http://localhost:3000/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-" new_intranet-api-1 | 172.18.0.1 - - [18/Sep/2022:15:57:47 +0000] "GET /assets/noticeBoard.2a7e00f7.js HTTP/1.1" 200 1874 "-" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-" new_intranet-api-1 | 172.18.0.1 - - [18/Sep/2022:15:57:47 +0000] "GET /assets/index.36ec5575.js HTTP/1.1" 200 3445 "-" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-" new_intranet-api-1 | 172.18.0.1 - - [18/Sep/2022:15:57:47 +0000] "GET /assets/promotionComponent.4cd1832f.js HTTP/1.1" 200 1830 "-" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-" new_intranet-api-1 | 172.18.0.1 - - [18/Sep/2022:15:57:47 +0000] "GET /assets/GalleryComponent.a6b4ac2f.js HTTP/1.1" 200 1022 "http://localhost:3000/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-" new_intranet-api-1 | 172.18.0.1 - - [18/Sep/2022:16:09:08 +0000] "GET / HTTP/1.1" 304 0 "-" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-"
nginx docker
0 Answers
Related