Phoenix server doesn't render css and images with Docker

Question

I'm new to Elixir and Phoenix, and having to work in CI/CD environment I'm trying to figure out how to use Phoenix with Docker.

I've tried various tutorials and videos out there, many of them doesn't work, but those who do work, they have the same result.

Phoenix server doesn't seems to find some resources (the assets folder?).

But inside my Dockerfile I'm copying the entire app folder, and I can confirm that /assets is inside the container by attaching to it.

Dockerfile:

FROM elixir:alpine

RUN apk add --no-cache build-base git

WORKDIR /app

RUN mix local.hex --force && \
    mix local.rebar --force

COPY . .

RUN mix do deps.get, deps.compile

CMD ["mix", "phx.server"]

Docker-compose

version: '3.6'
services:
  db:
    environment:
      PGDATA: /var/lib/postgresql/data/pgdata
      POSTGRES_PASSWORD: postgres
      POSTGRES_USER: postgres
      POSTGRES_HOST_AUTH_METHOD: trust
    image: 'postgres:11-alpine'
    restart: always
    volumes:
      - 'pgdata:/var/lib/postgresql/data'
  web:
    build: .
    depends_on:
      - db
    environment:
      MIX_ENV: dev
    env_file:
      - .env
    ports:
      - '4000:4000'
    volumes:
      - .:/app
volumes:
  pgdata:

Steps I'm doing to create the containers and running the server:

docker-compose build
docker-compose run web mix ecto.create
docker-compose up

The database is created successfully in the db container. What can be happening here?

Sorry if it's straightforward, I don't use Docker for a while and I still didn't understood Phoenix boilerplate completely.

If you know some good resources about Docker and CI/CD pipelines with Phoenix, I also appreciate so I can study it.

Steve Pallen · Accepted Answer · 2021-09-15 20:24:32Z

2

You also need to build the assets. npm install --prefix assets This needs to be done after after mix deps.get but can be done after the mix deps.compile which isn't really needed. You can start the server after mix deps.get and it will compile the deps and your app automatically.

answered Sep 15, 2021 at 20:24

Steve Pallen

4,55719 silver badges35 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

jacksonbenete Over a year ago

Thank you Steve, sorry for taking long to accept your answer. Although I knew that your answer was right, it still didn't worked but today. That's because node-sass was failing to compile. You need a specific version of node (node@14) to compile the assets and this isn't written anywhere but on a (closed!) issue from January. It's very frustrating to see it failing, googling around and not finding any information about why it fails, and it's wrong IMO to close an issue that still an issue.

Steve Pallen Over a year ago

Yes, I had the same issue with latest nodejs. I'm using node@14 also.

Collectives™ on Stack Overflow

Phoenix server doesn't render css and images with Docker

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related