Setup do projeto

Olá, João!
Tudo bem?

Sempre rodo os projetos dentro do WSL, apenas para padronizar e ter maior previsibilidade.

--

Você quer dockerizar essa aplicação para produção?
Se sim, te dou uma força.

Sim sim essa a intenção professor, como eu nunca subi uma aplicação VUE com docker fiquei curioso em como fazer isso funcionar..
Eu uso o setup padrão do Laravel que foi desenvolvido por você com alguma alterações mas para frontend eu nunca subi um container...

Dockerfile:
FROM node:lts-alpine as build-stage
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY ./ .
RUN npm run build

FROM nginx as production-stage
RUN mkdir /app
COPY --from=build-stage /app/dist /app
COPY ./docker/nginx.conf /etc/nginx/nginx.conf

Arquivo nginx para rodar o projeto:
/docker/nginx.conf
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       8080;
    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.7"
services:
    # image project
    frontend_vue:
        build:
            context: ./
            dockerfile: Dockerfile
        image: vue-app
        ports:
            - 80:8080
        restart: unless-stopped

Para testar, basta rodar o comando:
docker-compose up -d

Projeto consegui subir o projeto, está rodando Docker no front. Eu mexi em algumas coisas ao qual mandou nesse suporte.
Porém senti falta de algumas coisas como hot-reload eu até tentei fazer a configuração como pode ver no repo.
Você tem ideia de como eu posso estar atualizando o docker para reconhecer o hot-reload e eu também não estou conseguindo entrar no container com: docker-compose exec <nome-container> bash...

segue o link do repo: https://github.com/JplsMura/frontend-ead-vue

Se tiver alguma recomendação de otimização deste Dockerfile e docker-compose agradeço..

Olá, João!
Como vai?

Esse setup que te passei é para produção, inclusive é o que uso em https://ead.especializati.com.br/ (combinado com CI/CD)

Para ambiente dev, roda com npm run dev mesmo, vai facilitar para vc;