Bugfix : CSS assets are not available in the docker image #1110

zedalaye · 2023-06-19T21:29:13Z

Seems because app folder is copied over the built assets.

Looks like COPYing the app folder once is sufficient to be able to build everything after

(Rebased over today's develop branch)

bchamagne · 2023-06-20T09:25:53Z

I pulled your branch (removed all containers and images then rebuilded) and I still have the issue:

I'll ask around

samuelmanzanera · 2023-06-20T11:49:31Z

Seems the mix assets.saas is missing before the deploy as in the release script

archethic-node/scripts/release.sh

Lines 91 to 92 in f11e049

    
           mix assets.saas 
        
           mix assets.deploy

bchamagne · 2023-06-20T12:39:05Z

Seems the mix assets.saas is missing before the deploy as in the release script

archethic-node/scripts/release.sh

Lines 91 to 92 in f11e049

mix assets.saas

mix assets.deploy

I added it, but could not manage to fix the error I get:

[bastien@T495 archethic-node]$ docker build -t archethic-node .
DEPRECATED: The legacy builder is deprecated and will be removed in a future release.
            Install the buildx component to build images with BuildKit:
            https://docs.docker.com/go/buildx/

Sending build context to Docker daemon    187MB
Step 1/35 : FROM elixir:1.14.1-alpine AS archethic-ci
 ---> 88334cfa9988
Step 2/35 : ARG with_tests=1
 ---> Using cache
 ---> d874d8637f02
Step 3/35 : ARG MIX_ENV=prod
 ---> Using cache
 ---> fe231510b037
Step 4/35 : ARG USER_ID
 ---> Using cache
 ---> 0457a11bb16a
Step 5/35 : ARG GROUP_ID
 ---> Using cache
 ---> 791d3f5e2b24
Step 6/35 : ENV ARCHETHIC_NETWORK_TYPE=testnet
 ---> Using cache
 ---> 99d5838bb262
Step 7/35 : RUN apk add --no-cache --update   build-base   grep   bash   gcc   make   g++   git   npm   wget   openssl   libsodium-dev   libexecinfo-dev   gmp-dev
 ---> Using cache
 ---> 190f995f482d
Step 8/35 : RUN mix local.rebar --force   && mix local.hex --if-missing --force
 ---> Using cache
 ---> 4b3bca6d6b7c
Step 9/35 : WORKDIR /opt/code
 ---> Using cache
 ---> 2dd61eacc06d
Step 10/35 : COPY mix.exs mix.lock ./
 ---> Using cache
 ---> 79aa65a702a3
Step 11/35 : COPY config ./config
 ---> Using cache
 ---> 80afd403d4b9
Step 12/35 : RUN mix do deps.get, deps.compile
 ---> Using cache
 ---> 9753382b6b8c
Step 13/35 : COPY priv ./priv
 ---> Using cache
 ---> afcc66f3f415
Step 14/35 : COPY assets ./assets
 ---> Using cache
 ---> c5bf019ec2dc
Step 15/35 : RUN npm --prefix ./assets ci --progress=false --no-audit --loglevel=error
 ---> Using cache
 ---> 4f71ed1e4730
Step 16/35 : COPY . .
 ---> Using cache
 ---> e21f147762a2
Step 17/35 : RUN git config user.name aebot   && git config user.email [email protected]   && git remote add origin https://github.com/archethic-foundation/archethic-node
 ---> Using cache
 ---> 6d5cd4ab6a14
Step 18/35 : RUN mix assets.saas
 ---> Running in 05ceed75de33

12:37:15.403 [debug] Downloading dart-sass from https://github.com/sass/dart-sass/releases/download/1.54.5/dart-sass-1.54.5-linux-x64.tar.gz
** (Mix) `mix sass default --no-source-map --style=compressed` exited with 2

bchamagne · 2023-06-20T20:02:51Z

AFAIK sass is not working on this alpine. I might require help to debug further.

tried gcompat but I get the same error with code 139.
My guess is we need another way to compile the SASS that is alpine-ready

zedalaye · 2023-06-20T20:27:18Z

I think I know why it works for me : I compiled everything "locally" before building the docker image, so the assets are already compiled and if they are not ignored by the .dockerignore, they are copied into the image.

bchamagne · 2023-06-20T20:35:27Z

yes exactly. I never saw the issue for the same reason. To reproduce it, I clone the repository and run the docker build . command.

zedalaye · 2023-06-20T20:47:09Z

Have you seen this Elixir mix ? There is a FAQ regarding dart-sass and Alpine linux at the end of the README.

https://github.com/cargosense/dart_sass

bchamagne · 2023-06-20T21:03:49Z

Have you seen this Elixir mix ? There is a FAQ regarding dart-sass and Alpine linux at the end of the README.

https://github.com/cargosense/dart_sass

wow great find, much better than the solution I hacked:

FROM elixir:1.14.1-alpine AS archethic-ci

ARG with_tests=1
ARG MIX_ENV=prod
ARG USER_ID 
ARG GROUP_ID

# CI
#  - compile
#  - release
#  - gen PLT

# running CI with proposal should generate release upgrade
#  - commit proposal
#  - compile
#  - run ci
#  - generate release upgrade

######### TODO
# TESTNET
#  - code
#  - release

ENV ARCHETHIC_NETWORK_TYPE=testnet

RUN apk add --no-cache --update \
  build-base \
  grep \
  bash \
  gcc \
  make \
  g++ \
  git \
  npm \
  wget \
  openssl \
  libsodium-dev \
  libexecinfo-dev \
  gmp-dev \
  sassc

# Install hex and rebar
RUN mix local.rebar --force \
  && mix local.hex --if-missing --force

WORKDIR /opt/code

# install mix dependencies
COPY Makefile Makefile
COPY mix.exs mix.lock ./
COPY config ./config
RUN mix do deps.get, deps.compile

# build assets
COPY priv ./priv
COPY assets ./assets 
RUN npm --prefix ./assets ci --progress=false --no-audit --loglevel=error 

# sass
WORKDIR /opt/code/assets/css
RUN sassc app.scss > app.css
WORKDIR /opt/code

# copy the rest of the folder
COPY . .

RUN git config user.name aebot \
  && git config user.email [email protected] \
  && git remote add origin https://github.com/archethic-foundation/archethic-node

# build release
RUN mix compile
RUN mix assets.deploy
RUN mkdir -p priv/static/css
RUN cp assets/css/app.css priv/static/css
RUN mix distillery.release

# Install
RUN mkdir -p /opt/app \
  && tar zxf /opt/code/_build/${MIX_ENV}/rel/archethic_node/releases/*/archethic_node.tar.gz -C  /opt/app
CMD /opt/app/bin/archethic_node foreground

################################################################################

FROM archethic-ci as build

FROM elixir:1.14.1-alpine

ARG USER_ID 
ARG GROUP_ID

RUN apk add --no-cache --update bash git openssl libsodium libexecinfo miniupnpc

COPY --from=build /opt/app /opt/app
COPY --from=build /opt/code/.git /opt/code/.git

WORKDIR /opt/code
RUN git reset --hard

RUN rm -rf /opt/code/.git
RUN rm -rf /opt/code/priv

WORKDIR /opt/app
CMD /opt/app/bin/archethic_node foreground

I'll try it right now

bchamagne · 2023-06-20T21:31:03Z

Have you seen this Elixir mix ? There is a FAQ regarding dart-sass and Alpine linux at the end of the README.

https://github.com/cargosense/dart_sass

Unfortunately I couldn't make it work. I'll try to get some help this week

bchamagne · 2023-06-20T21:51:52Z

Took me a while but I think I got it, I used the --force-overwrite suggested here: sgerrand/alpine-pkg-glibc#185 (comment)

zedalaye · 2023-06-21T20:50:16Z

My docker builder is not happy with those lines ending with && without backslashes.

...
# https://github.com/cargosense/dart_sass#compatibility-with-alpine-linux-mix-sass-default-exited-with-2
ENV GLIBC_VERSION=2.34-r0
RUN wget -q -O /etc/apk/keys/sgerrand.rsa.pub https://alpine-pkgs.sgerrand.com/sgerrand.rsa.pub &&\
  wget -q -O /tmp/glibc.apk https://github.com/sgerrand/alpine-pkg-glibc/releases/download/${GLIBC_VERSION}/glibc-${GLIBC_VERSION}.apk &&\
  apk add --force-overwrite /tmp/glibc.apk &&\
  rm -rf /tmp/glibc.apk

# Install hex and rebar
RUN mix local.rebar --force &&\
  mix local.hex --if-missing --force
...

zedalaye · 2023-06-21T20:52:44Z

Just tested the "fixed" version (with backslashes) and it works, the CSS assets look good now.

Seems because app folder is copied over the built assets. Looks like COPYing the app folder once is sufficient to be able to build everything after

zedalaye · 2023-06-21T21:01:13Z

Should this branch be rebased over develop or master or 1.2.0 ?

samuelmanzanera · 2023-06-22T06:48:28Z

Should this branch be rebased over develop or master or 1.2.0 ?

Develop is the good one

bchamagne added the docker label Jun 20, 2023

bchamagne approved these changes Jun 21, 2023

View reviewed changes

zedalaye and others added 3 commits June 21, 2023 22:58

Bugfix : CSS assets are not available in the docker image

e877fc2

Seems because app folder is copied over the built assets. Looks like COPYing the app folder once is sufficient to be able to build everything after

add glibc to be able to use dart_sass

f38182f

Fix missing backslahes at end of lines

f272826

zedalaye force-pushed the fix-docker-assets branch from 60cbfd9 to f272826 Compare June 21, 2023 21:13

Neylix approved these changes Jun 26, 2023

View reviewed changes

Neylix merged commit cfb9ed8 into archethic-foundation:develop Jun 26, 2023

zedalaye deleted the fix-docker-assets branch June 27, 2023 09:36

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Bugfix : CSS assets are not available in the docker image #1110

Bugfix : CSS assets are not available in the docker image #1110

zedalaye commented Jun 19, 2023

bchamagne commented Jun 20, 2023 •

edited

Loading

samuelmanzanera commented Jun 20, 2023

bchamagne commented Jun 20, 2023

bchamagne commented Jun 20, 2023 •

edited

Loading

zedalaye commented Jun 20, 2023

bchamagne commented Jun 20, 2023

zedalaye commented Jun 20, 2023

bchamagne commented Jun 20, 2023

bchamagne commented Jun 20, 2023

bchamagne commented Jun 20, 2023

zedalaye commented Jun 21, 2023

zedalaye commented Jun 21, 2023

zedalaye commented Jun 21, 2023

samuelmanzanera commented Jun 22, 2023

Bugfix : CSS assets are not available in the docker image #1110

Bugfix : CSS assets are not available in the docker image #1110

Conversation

zedalaye commented Jun 19, 2023

bchamagne commented Jun 20, 2023 • edited Loading

samuelmanzanera commented Jun 20, 2023

bchamagne commented Jun 20, 2023

bchamagne commented Jun 20, 2023 • edited Loading

zedalaye commented Jun 20, 2023

bchamagne commented Jun 20, 2023

zedalaye commented Jun 20, 2023

bchamagne commented Jun 20, 2023

bchamagne commented Jun 20, 2023

bchamagne commented Jun 20, 2023

zedalaye commented Jun 21, 2023

zedalaye commented Jun 21, 2023

zedalaye commented Jun 21, 2023

samuelmanzanera commented Jun 22, 2023

bchamagne commented Jun 20, 2023 •

edited

Loading

bchamagne commented Jun 20, 2023 •

edited

Loading