Github Actions deployment issues

[denielchiang]

This 2 files are not be found when deployed by Github Action.

• /images/bg.avif
• /fonts/Comfortaa-VariableFont_wght.ttf

[denielchiang]

https://community.fly.io/t/cannot-find-module-daisyui-in-elixir-phoenix-flyctl-launch/6267/2

[denielchiang]

#18 [builder 12/20] RUN npm --prefix ./assets ci --progress=false --no-audit --loglevel=error
#18 0.867 npm ERR! (intermediate value)(intermediate value)(intermediate value).then is not a function
#18 0.874 
#18 0.874 npm ERR! A complete log of this run can be found in:
#18 0.874 npm ERR!     /root/.npm/_logs/2024-05-10T13_50_27_668Z-debug.log
#18 ERROR: process "/bin/sh -c npm --prefix ./assets ci --progress=false --no-audit --loglevel=error" did not complete successfully: exit code: 1
------
 > [builder 12/20] RUN npm --prefix ./assets ci --progress=false --no-audit --loglevel=error:
 ERR! (intermediate value)(intermediate value)(intermediate value).then is not a function
0.874 
0.874 npm ERR! A complete log of this run can be found in:
0.874 npm ERR!     /root/.npm/_logs/2024-05-10T13_50_27_668Z-debug.log
------
Error: failed to fetch an image or build from source: error building: failed to solve: process "/bin/sh -c npm --prefix ./assets ci --progress=false --no-audit --loglevel=error" did not complete successfully: exit code: 1
Error: Process completed 

[denielchiang]

Try out 3 has no error during building. However the background image and font are still missing.

[denielchiang]

Try out 4 not works neither. Wild guess maybe just deploy from local first then try Github Actions next times?

[denielchiang]

From local to run fly deploy --remote-only then everything is good.

[denielchiang]

I found a discussion on Elixir forum that might works. Give a try on my local and remove all ESBuild customize settings like this post said. Take a try on Git Action deploy to Fly.

The solution I have come up with is to just skip all the ESBuild config stuff and manually convert the .ttf files to .woff2 and then just manually convert the .woff2 files to base64-encoded datauri strings that I manually include in my CSS file.

First, I use this tool to convert .ttf to .woff2: TTF to WOFF2 | CloudConvert 20

Then I use this tool to covert .woff2 to a base64-encoded datauri string: Woff2Base: Convert .woff2 to accurate Base64 css. 37

[denielchiang]

The font worked by this way. the bg.avif image left to solve.

I found a discussion on Elixir forum that might works. Give a try on my local and remove all ESBuild customize settings like this post said. Take a try on Git Action deploy to Fly.

The solution I have come up with is to just skip all the ESBuild config stuff and manually convert the .ttf files to .woff2 and then just manually convert the .woff2 files to base64-encoded datauri strings that I manually include in my CSS file. First, I use this tool to convert .ttf to .woff2: TTF to WOFF2 | CloudConvert 20 Then I use this tool to covert .woff2 to a base64-encoded datauri string: Woff2Base: Convert .woff2 to accurate Base64 css. 37

[denielchiang]

fixed!