A cordial greeting.
I am learning to use the fly.io platform
To deploy apps in Phoenix, and the following problem happens to me:
I can’t access my files from the HOSTNAME url.
I tell you, my local project works fine.
Where I have elixir configured to compile with esbuild through custom aliases such as:
"assets.deploy.test_build": [
"cmd --cd assets node build-test.js --deploy",
"phx.digest"
],
In the Dockerfile, I have the following statement:
compile assets
RUN cd assets
&& npm install
&& cd …
&& mix assets.deploy.test_build
But when I try to include a file for example css, it doesn’t show it and throws me a 404
From what I understood from the phoenix documentation, the builds go in the ./priv/static/assets folder
Try to find the directory by connecting through the command: flyctl ssh console
But I didn’t find anything, I don’t know where my project is either.
greg
May 1, 2022, 6:24pm
2
Would you able to post the full Dockerfile
to see what’s going on? I’m sure one of the Phoenix guys on here will be able to assist.
1 Like
# Find eligible builder and runner images on Docker Hub. We use Ubuntu/Debian instead of
# Alpine to avoid DNS resolution issues in production.
#
# https://hub.docker.com/r/hexpm/elixir/tags?page=1&name=ubuntu
# https://hub.docker.com/_/ubuntu?tab=tags
#
#
# This file is based on these images:
#
# - https://hub.docker.com/r/hexpm/elixir/tags - for the build image
# - https://hub.docker.com/_/debian?tab=tags&page=1&name=bullseye-20210902-slim - for the release image
# - https://pkgs.org/ - resource for finding needed packages
# - Ex: hexpm/elixir:1.13.2-erlang-24.1.4-debian-bullseye-20210902-slim
#
ARG ELIXIR_VERSION=1.13.2
ARG OTP_VERSION=24.1.4
ARG DEBIAN_VERSION=bullseye-20210902-slim
ARG BUILDER_IMAGE="hexpm/elixir:${ELIXIR_VERSION}-erlang-${OTP_VERSION}-debian-${DEBIAN_VERSION}"
ARG RUNNER_IMAGE="debian:${DEBIAN_VERSION}"
FROM ${BUILDER_IMAGE} as builder
# install build dependencies
RUN apt-get update -y \
&& apt-get install curl -y \
&& apt-get install -y build-essential git \
&& apt-get clean \
&& rm -f /var/lib/apt/lists/*_* \
&& curl -sL https://deb.nodesource.com/setup_10.x | bash - \
&& apt-get install -y nodejs \
&& apt-get install -y npm
# prepare build dir
WORKDIR /app
# install hex + rebar
RUN mix local.hex --force && \
mix local.rebar --force
# set build ENV
ENV MIX_ENV="prod"
# install mix dependencies
COPY mix.exs mix.lock ./
RUN mix deps.get --only $MIX_ENV
RUN mkdir config
# copy compile-time config files before we compile dependencies
# to ensure any relevant config change will trigger the dependencies
# to be re-compiled.
COPY config/config.exs config/${MIX_ENV}.exs config/
COPY priv priv
COPY lib lib
COPY assets assets
# compile assets
RUN cd assets \
&& npm install \
&& cd .. \
&& mix assets.deploy.campana_invierno
# Compile the release
RUN mix compile
# Changes to config/runtime.exs don't require recompiling the code
COPY config/runtime.exs config/
COPY rel rel
RUN mix release
# start a new build stage so that the final image will only contain
# the compiled release and other runtime necessities
FROM ${RUNNER_IMAGE}
RUN apt-get update -y && apt-get install -y libstdc++6 openssl libncurses5 locales \
&& apt-get clean && rm -f /var/lib/apt/lists/*_*
# Set the locale
RUN sed -i '/en_US.UTF-8/s/^# //g' /etc/locale.gen && locale-gen
ENV LANG en_US.UTF-8
ENV LANGUAGE en_US:en
ENV LC_ALL en_US.UTF-8
WORKDIR "/app"
RUN chown nobody /app
ENV PORT=8080
EXPOSE ${PORT}
# set runner ENV
ENV MIX_ENV="prod"
# Only copy the final release from the build stage
COPY --from=builder --chown=nobody:root /app/_build/${MIX_ENV}/rel/api ./
USER nobody
CMD ["/app/bin/server"]
greg
May 2, 2022, 2:42pm
4
Well … as regards using fly ssh console
and not seeing your app, as I read the last bit of that file, there should be an /app
folder. Isn’t there? That would be where I’d look.
As regards the paths to static files, like .css, I don’t know enough about it and I don’t want to tell you the wrong thing (with a guess). Someone here will be able to help though
Yes, I do have the folder. And I can also consume an API route that I create for testing.
The problem is that I can’t access public files like images, after deploying in phoenix.
thanks for giving me clues
1 Like
Can you check to see if the node build artifacts made into the private directory?
$ fly ssh console
$ ls /app/lib/your_app-0.1.0/priv
Replace your_app
and the 0.1.0
release version with whatever is relevant and report back. Thanks!
1 Like
Hello, thank you very much for your answer.
I just saw the route, which I did not know. Where if I see the public files such as js, css.
attached capture of what a folder looks like, which has a js file
I haven’t been able to figure out the problem yet.
Sorry can you show the folder contents, as well as the path that results in a 404? Your endpoint’s Plug.Static
options would also be helpful to see
1 Like
Dear, reviewing the code along with your comment I saw that it was missing to add the folder in “only”:
plug Plug.Static,
only: ~w(assets inpages fonts images favicon.ico robots.txt)
thanks