Add Dockerfile for build

[wicksome]

• Add Dockerfile for plantuml-editor server
• Support custom plantuml-server url using --env option at build time. Use custom plantuml server #10

[HeinrichAD]

I think it's a great idea to add Dockerfile for plantuml-editor. However, some things seem to have changed in the meantime.

Dockerfile

• VUE_CONFIG_SERVER doesn't exists anymore
• the URL has changed
• ARG vs ENV
  Since these arguments must be fixed at build time and cannot be changed at runtime, ARG would be the right choice. Otherwise, users might think that these parameters can be changed even after the image is created.
• Use the alpine version of NGINX. This would redurce the size from ~52.75 MB to just ~9.82 MB.

These changes would result in the following files:

Dockerfile

FROM node:12 AS builder

# fetch sources
COPY . /usr/app
#RUN wget "https://github.com/kkeisuke/plantuml-editor/archive/refs/heads/master.zip" && \
#    unzip "master.zip" && \
#    mv plantuml-editor-master /usr/app

WORKDIR /usr/app

# NOTE
#   - tailing "/" is important! (At least for VUE_APP_CDN.)
#   - VUE_APP_SERVER will never used. (Drop it?)
# See PR#19
# https://github.com/kkeisuke/plantuml-editor/pull/19
ARG VUE_APP_URL=https://plantuml-editor.kkeisuke.com/
ARG VUE_APP_SERVER=https://plantuml-server.kkeisuke.dev/
ARG VUE_APP_CDN=https://plantuml-server.kkeisuke.dev/

# build app
RUN npm install && \
    npm run flow-typed && \
    npm run build


# NGINX Alpine as minimal web server
FROM nginx:alpine

WORKDIR /usr/share/nginx/html

COPY --from=builder /usr/app/dist/ .

README.md Part:

# build with docker
docker build \ 
       -t plantuml-editor \
       --build-arg VUE_APP_URL=http://localhost:8080/ \
       --build-arg VUE_APP_SERVER=http://localhost:4000/ \
       --build-arg VUE_APP_CDN=http://localhost:4000/ \
       .

# or with PR#19
# https://github.com/kkeisuke/plantuml-editor/pull/19
docker build \ 
       -t plantuml-editor \
       --build-arg VUE_APP_URL=http://localhost:8080 \
       --build-arg VUE_APP_CDN=http://localhost:4000 \
       .

# run plantuml-editor server with docker
docker run -d -p 8080:80 --name plantuml-editor plantuml-editor

And if docker-compose is a thing:

version: '3'
services:
  plantuml-editor:
    build:
      context: .
      dockerfile: Dockerfile
      args:
        - VUE_APP_URL=http://localhost:8080
        - VUE_APP_SERVER=http://localhost:4000/
        - VUE_APP_CDN=http://localhost:4000/
    restart: always
    container_name: plantuml-editor
    #environment:
    #  - TZ=...
    ports: 
      - 8080:80

[wicksome]

@HeinrichAD
Thanks!
I've incorporated your comment into the 655e686.

[HeinrichAD]

@wicksome
The changes are fine.
I would say without any code changes this is the best we could achieve.

Unfortunately, it looks like PRs are not really reviewed. Therefore I currently only use my own clone 😞.

---

Additional Features

Should there be further interest, the changes can be found here.

• dockerized on Docker Hub
  • change VUE_APP_* build arguments to environment variables
• add relative path (URL) support [PR#1]
• update URLs to use https [PR#2]
• refactor environment variables [PR#3]
• add further diagram support [PR#4]
  • json
  • latex
  • math
  • salt
  • yaml

[dylan-shipwell]

Thank you this, I've wrapped this up with a docker-compose shell for a turn-key self-hosted plantuml editor, over here

https://github.com/dylan-shipwell/plantuml-editor

just docker-compose up and use it