Sass building for prod in container

Questions / Help
1

Hi,

I’m trying to build a Phoenix project for production, that I just upgraded to 1.6. It works on my machine.

I added DartSass to my project. However when attempting to build it in a Docker container for release, DartSass fails. First because of the environment: this can be “fixed” by overriding the env like:

- RUN mix deps.get --only prod && \
+ RUN mix deps.get && \
    mix deps.compile

- RUN mix sass.install
+ RUN MIX_ENV=dev mix sass.install

However when attempting to use it, it fails like:

$ docker run -it <img> sh
/app # mix sass default --no-source-map --style=compressed
** (Mix) `mix sass default --no-source-map --style=compressed` exited with 2

I feel like I’m simply going down a completely wrong path here.

How do other people build their Sass for release?

2

Found out that the Dart Sass binaries doesn’t run on Alpine. I ran into this: linux - Alpine shell can't find file in docker - Server Fault and tried the suggested solution, but couldn’t get it to run :man_shrugging:

Dart Sass do provide a Javascript version. I ended up with this in my Dockerfile:

- RUN apk add --no-cache build-base
+ RUN apk add --no-cache build-base npm

+ # Install Dart Sass
+ RUN npm install -g sass

[...]

+ # build Sass -> CSS
+ RUN cd assets && \
+     sass --no-source-map --style=compressed css/app.scss ../priv/static/assets/app.css

# build assets
RUN mix assets.deploy
[...]

where mix.exs assets.deploy is:

  defp aliases do
    [...]
     "assets.deploy": [
       "esbuild default --minify",
       "phx.digest"
     ]
  end

That seemed to work :checkered_flag:

1 Like
3

Hi, there is an issue, open in dart_sass, where we try to find a solution for alpine. One is to install glibc on alpine:

It works for me now, i can run dart_sass on my alpine build pipeline.

Maybe you want to join the issue discussion.

1 Like