How to include Quinoa frontend build in Docker image using Quarkus's default Dockerfile.jvm?

[derfelix54]

Hi Quinoa community,

I'm working on a project using Quarkus and Quinoa to build my frontend with SvelteKit. The frontend files are successfully generated in the .svelte-kit/output/client directory. However, when I use Quarkus's default Docker build process (Dockerfile.jvm), it only copies my backend code into the Docker image and ignores the frontend files.

What is the best approach to automatically include the Quinoa frontend build files in the Docker image, so both backend and frontend are available in the same image?

Here's what I've tried so far:

I noticed that the default Dockerfile.jvm doesn't handle the Quinoa build output. I manually added COPY commands to include the frontend files, but this failes the build. I'm looking for a more automated solution, possibly through Quarkus or Quinoa configurations.
Any advice or recommendations on how to integrate the frontend build into the Docker image using the default Quarkus Docker build process would be appreciated!

Thanks in advance!

[melloware]

I think you want this property: https://docs.quarkiverse.io/quarkus-quinoa/dev/config-reference.html#quarkus-quinoa_quarkus-quinoa-build-dir

quarkus.quinoa.build-dir=.svelte-kit/output/client

[melloware]

cc @trpouh @steffenvan @fblan you guys are the Svelte guys that updated all these docs any advice for @derfelix54 here?

[fblan]

I have never tried to deploy on docker :(

[melloware]

Well i think he is having trouble in general serving his Svelte App in production mode. I think you can take Docker out of it.

[derfelix54]

@melloware @fblan Yes that's correct. In development mode with the vite server everything is getting served but If I try to build everything for production, only my index.html can be displayed and every other +page.svelte in the src/routes/ folder is giving me following error:
For example src/routes/login/+page.svelte

2024-10-16 15:54:38,939 DEBUG [org.jbo.res.res.i18n] (executor-thread-1) RESTEASY002315: PathInfo: /login
2024-10-16 15:54:38,939 DEBUG [io.qua.qui.QuinoaSPARoutingHandler] (executor-thread-1) Quinoa is re-routing SPA request '/login' to '/'
2024-10-16 15:54:38,943 ERROR [io.qua.ver.htt.run.QuarkusErrorHandler] (vert.x-eventloop-thread-6) HTTP Request to / failed, error id: dbc2624e-6d89-47fd-adf4-5c9eb815f88d-2: io.vertx.core.impl.NoStackTraceThrowable

[melloware]

@derfelix54 its not related to the PLUS sign issue is it?

[fblan]

If it can help, I have a repo here https://github.com/fblan/QuarkusSvelteKitDemo that is able to run a sveltekit application with a very basic routing, and communicating with backend.
./mvnw package
java -jar target/quarkus-app/quarkus-run.jar

It is an old project, and I don't remember if I have done something special to make it work. I will have look tomorrow morning.
I hope it can help.

[fblan]

I have tested my application https://github.com/fblan/QuarkusSvelteKitDemo and it work normally in production mode (the +page for todos is correctly displayed.).
I have tried to update it to last version of quarkus and quinoa and it is still working.

[trpouh]

hey! sorry for the late reply. We've been running our monolithic application in docker just fine. We run the build with JIB (so without dockerfile) in our CICD pipeline and push it directly to the registry where it is auto-deployed to a cluster.

This is the build command:

mvn compile quarkus:build \
  -DskipTests \
  -Dquarkus.container-image.group=$DOCKER_GROUP \
  -Dquarkus.container-image.registry=$DOCKER_REGISTRY \
  -Dquarkus.container-image.tag=latest \
  -Dquarkus.container-image.build=true \
  -Dquarkus.container-image.push=true \

and here our quinoa related application.properties:

quarkus.quinoa.build-dir=build
quarkus.quinoa.enable-spa-routing=true
quarkus.quinoa.dev-server.port=5173

If your use-case allows it I'd suggest you take a look at jib - doesn't need a docker daemon, less priviliges, and integrates directly into maven/gradle.

Hope this helps you.

[derfelix54]

@melloware @fblan @trpouh Thank you for taking the time to help me out! I found the solution to the problem. In my pom I was using

<dependency>
   <groupId>io.quarkus</groupId>
   <artifactId>quarkus-resteasy</artifactId>
</dependency>
<dependency>
   <groupId>io.quarkus</groupId>
   <artifactId>quarkus-resteasy-jackson</artifactId>
</dependency>

I analyzed https://github.com/fblan/QuarkusSvelteKitDemo and saw that @fblan is using quarkus-resteasy-reactive. I changed the dependencies to these ones and voila it works! I'm assuming Quinoa is not compatible to quarkus-resteasy.
After that, packaging and building for docker worked completly fine and I can now properly display the svelte sites on the production server.

[melloware]

and actually in 3.15.0 you aren't supposed to use resteasy any more its just...

<dependency>
			<groupId>io.quarkus</groupId>
			<artifactId>quarkus-rest</artifactId>
		</dependency>
<dependency>
			<groupId>io.quarkus</groupId>
			<artifactId>quarkus-rest-jackson</artifactId>
		</dependency>