Dockerize vue project

Question

I have installed a simple vue project via cli. I've created Dockerfile and docker-compose.yml file.

But after docker-compose build && docker-compose up I get 404 page

Project Structure

simple-chat
- docker
  - docker-compose.yml
  - Dockerfile
- public
- src
- package.json

the commands

cd docker 
docker build -t simple-chat .. 
winpty docker run -it -p 8080:8080 --rm --name simple-chat simple-chat

opens http://localhost:8080 correctly

The commands

docker-compose build --no-cache 
docker-compose up

returns 404 page in browser

What I did wrong ?

Dockerfile

FROM node:lts-alpine
RUN npm install -g http-server

WORKDIR /app/simple-chat

COPY ../package*.json ./
RUN yarn install
COPY ../ .
RUN yarn build

EXPOSE 8080
CMD [ "http-server", "dist", "--host", "0.0.0.0"]

docker-compose.yml

version: '3.5'
services:

  simple-chat:
    build:
      context: ../
      dockerfile: docker/Dockerfile
    image: simple-chat
    ports:
      - '8080:8080'
    volumes:
      - ../:/app/simple-chat

by using volumes you're not containerizing the application, as you want to run from a local folder, and compose, if only one service, you don't even need to use it, right? the docker run would ultimately run it... — balexandre
– balexandre, Commented Jan 10, 2021 at 0:00

Max · Accepted Answer · 2021-01-11 09:22:13Z

1

Answer

You have mistaken the http-server path on Dockerfile

CMD [ "http-server", "/app/simple-chat/dist"]

Remove the volumes: from compose if you want containerize app (you copy everything on Dockerfile) otherwise remove the COPY from Dockerfile and set volumes:

Consideration

Is possible to build a vuecli app without vuecli but you know some consideration see this stackoverflow post.

edited Jan 11, 2021 at 9:22

answered Jan 10, 2021 at 18:24

Max

7,1503 gold badges51 silver badges67 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

ErikMD Over a year ago

the OP is probably running docker under Windows, see e.g. this SO question which deals with winpty.

ErikMD Over a year ago

Also, you only said that docker-compose is not necessary, but the crux of the issue raised by the OP is probably the unexpected volumes: field, which should be removed, as pointed out by @balexandre's comment

ErikMD Over a year ago

Finally, note that even if one only has one container, docker-compose can still be handy to easily run the container with a single command (docker-compose up), avoiding a long list of CLI arguments and relying on a "declarative spec" (docker-compose.yml): see e.g. this SO answer where I gave a pointer to a tool that can automate the generation of the docker-compose.yml file.

Max Over a year ago

@ErikMD I updated the answer with your suggestions

ErikMD Over a year ago

OK! but it doesn't seem you actually took them into account? (regarding docker-compose :)

Collectives™ on Stack Overflow

Dockerize vue project

1 Answer 1

Answer

Consideration

5 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Answer

Consideration

5 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related