Demonstrate way to use hilla with docker

[sarkarshuvojit]

Dockerizing applications are a very common way people like to deploy their applications.

The documentation can contain a section for docker covering:

• How to dockerize a hilla project
• A Sample Dockefile which can build the whole stack into a single jar

I am open to work on this, since I'm already currently building a dockerfile to run a hilla project.

[tarekoraby]

Thanks for the ticket. In its simplest form, deploying Hilla using docker should be a matter of:

1. Creating a Dockerfile in the project root directory:

   FROM openjdk:17-jdk-slim
   COPY target/*.jar app.jar
   EXPOSE 8080
   ENTRYPOINT ["java", "-jar", "/app.jar"]

2. Run:

• mvn clean package -Pproduction
• docker build . -t myapp:latest
• docker run -p 8080:8080 myapp:latest

[tarekoraby]

This would be useful to add to the docs, of course.

[sarkarshuvojit]

That's great, but this step assumes that the jar is packaged manually before creating the docker image?

What we want to build the whole thing inside docker itself?

I've been trying to pitch hilla for an internal project in my org, but the only thing stopping us is inability to build it in our pipelines itself.

Optimally we wouldn't want a developer to build it themselves then just add it to the docker image, rather we'd want to have a multi step docker file which first builds the jar in the first step then copies the built artifact into the final docker image.

Is there any way of doing that as of now?

[tarekoraby]

In theory, a Dockerfile like the following should work (but it fails with an error)

# Stage that builds the application, a prerequisite for the running stage
FROM maven:3-openjdk-17-slim as build

# Stop running as root at this point
RUN useradd -m myuser
WORKDIR /usr/src/app/
RUN chown myuser:myuser /usr/src/app/
USER myuser

# Copy pom.xml and prefetch dependencies so a repeated build can continue from the next step with existing dependencies
COPY --chown=myuser pom.xml ./
RUN mvn dependency:go-offline -Pproduction

# Copy all needed project files to a folder
COPY --chown=myuser:myuser src src
COPY --chown=myuser:myuser frontend frontend
COPY --chown=myuser:myuser package.json ./

# Using * after the files that are autogenerated so that so build won't fail if they are not yet created
COPY --chown=myuser:myuser package-lock.json* pnpm-lock.yaml* webpack.config.js* vite.config.js* ./

# Build the production package, assuming that we validated the version before so no need for running tests again
RUN mvn clean package -DskipTests -Pproduction

# Running stage: the part that is used for running the application
FROM openjdk:17-jdk-slim
COPY --from=build /usr/src/app/target/*.jar /usr/app/app.jar
RUN useradd -m myuser
USER myuser
EXPOSE 8080
CMD java -jar /usr/app/app.jar

This is the error when building the image:

...
#17 80.48 [INFO] BUILD FAILURE
#17 80.48 [INFO] ------------------------------------------------------------------------
#17 80.48 [INFO] Total time:  01:19 min
#17 80.48 [INFO] Finished at: 2023-04-12T09:31:54Z
#17 80.48 [INFO] ------------------------------------------------------------------------
#17 80.48 [ERROR] Failed to execute goal dev.hilla:hilla-maven-plugin:2.0.4:build-frontend (default) on project my-hilla-app-for-docker: Execution default of goal dev.hilla:hilla-maven-plugin:2.0.4:build-frontend failed: Vite process exited with non-zero exit code.
#17 80.48 [ERROR] Stderr: 'vite v4.1.3 building for production...
#17 80.48 [ERROR] transforming...
#17 80.48 [ERROR] ✓ 243 modules transformed.
#17 80.48 [ERROR] rendering chunks...
#17 80.48 [ERROR] frontend/views/MainLayout.tsx(35,51): error TS2339: Property 'navlink' does not exist on type 'CSSResultGroup'.
#17 80.48 [ERROR]   Property 'navlink' does not exist on type 'CSSResult'.
#17 80.48 [ERROR] frontend/views/MainLayout.tsx(35,77): error TS2339: Property 'navlink_active' does not exist on type 'CSSResultGroup'.
#17 80.48 [ERROR]   Property 'navlink_active' does not exist on type 'CSSResult'.
#17 80.48 [ERROR] frontend/views/MainLayout.tsx(42,36): error TS2339: Property 'navicon' does not exist on type 'CSSResultGroup'.
#17 80.48 [ERROR]   Property 'navicon' does not exist on type 'CSSResult'.
#17 80.48 [ERROR] ': Unexpected exit value: 2, allowed exit values: [0], executed command [/home/myuser/.vaadin/node/node, /usr/src/app/node_modules/vite/bin/vite.js, build] in directory /usr/src/app with environment {PATH=/home/myuser/.vaadin/node:/usr/local/openjdk-17/bin:/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin, MAVEN_HOME=/usr/share/maven, JAVA_HOME=/usr/local/openjdk-17, MAVEN_CONFIG=/root/.m2, MAVEN_PROJECTBASEDIR=/usr/src/app, OLDPWD=/usr/src/app, PWD=/usr/src/app, JAVA_VERSION=17.0.2, LANG=C.UTF-8, MAVEN_CMD_LINE_ARGS=/root/.m2 clean package -DskipTests -Pproduction, HOME=/home/myuser}, output was 625 bytes:
#17 80.48 [ERROR] vite v4.1.3 building for production...
#17 80.48 [ERROR] transforming...
#17 80.48 [ERROR] ✓ 243 modules transformed.
#17 80.49 [ERROR] rendering chunks...
#17 80.49 [ERROR] frontend/views/MainLayout.tsx(35,51): error TS2339: Property 'navlink' does not exist on type 'CSSResultGroup'.
#17 80.49 [ERROR]   Property 'navlink' does not exist on type 'CSSResult'.
#17 80.49 [ERROR] frontend/views/MainLayout.tsx(35,77): error TS2339: Property 'navlink_active' does not exist on type 'CSSResultGroup'.
#17 80.49 [ERROR]   Property 'navlink_active' does not exist on type 'CSSResult'.
#17 80.49 [ERROR] frontend/views/MainLayout.tsx(42,36): error TS2339: Property 'navicon' does not exist on type 'CSSResultGroup'.
#17 80.49 [ERROR]   Property 'navicon' does not exist on type 'CSSResult'.
#17 80.49 [ERROR] -> [Help 1]
...

@Artur- , do you know how to fix this?

[Artur-]

Change

COPY --chown=myuser:myuser package.json ./

to

COPY --chown=myuser:myuser package.json tsconfig.json types.d.ts ./

so it includes all the needed config files