Here you go: Phoenix 1.6.0 LiveView + esbuild + Tailwind JIT + AlpineJS - A brief tutorial.

Upgrade using PhoenixDiff. Then add Tailwind and Alpine.

For anyone who needs a Fly.io Dockerfile for this:

Note: Change the XXXX’s below to your app name

ARG MIX_ENV="prod"

FROM hexpm/elixir:1.12.1-erlang-24.0.1-alpine-3.13.3 AS build

# install build dependencies
RUN apk add --no-cache build-base git python3 curl npm
# If you prefer yarn instead, swap out the runs here and at the NPM install section below, 
# and be sure to update your mix.exs to run yarn instead of npm
# RUN apk add --no-cache build-base git python3 curl yarn

# prepare build dir
WORKDIR /app

# install hex + rebar
RUN mix local.hex --force && \
  mix local.rebar --force

# set build ENV
ARG MIX_ENV
ENV MIX_ENV="${MIX_ENV}"

# 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/
RUN mix deps.compile

COPY priv priv

# note: if your project uses a tool like https://purgecss.com/,
# which customizes asset compilation based on what it finds in
# your Elixir templates, you will need to move the asset compilation
# step down so that `lib` is available.

COPY assets assets
#If you prefer yarn instead
# RUN yarn install --cwd ./assets 
RUN npm install --prefix ./assets
RUN mix assets.deploy

# compile and build the release
COPY lib lib
RUN mix compile
# changes to config/runtime.exs don't require recompiling the code
COPY config/runtime.exs config/
# uncomment COPY if rel/ exists
# 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 alpine:3.12.1 AS app
RUN apk add --no-cache libstdc++ openssl ncurses-libs

ARG MIX_ENV
ENV USER="elixir"

WORKDIR "/home/${USER}/app"
# Creates an unprivileged user to be used exclusively to run the Phoenix app
RUN \
  addgroup \
  -g 1000 \
  -S "${USER}" \
  && adduser \
  -s /bin/sh \
  -u 1000 \
  -G "${USER}" \
  -h "/home/${USER}" \
  -D "${USER}" \
  && su "${USER}"

# Everything from this line onwards will run in the context of the unprivileged user.
USER "${USER}"

COPY --from=build --chown="${USER}":"${USER}" /app/_build/"${MIX_ENV}"/rel/XXXX ./

ENTRYPOINT ["bin/XXXX"]

# Usage:
#  * build: sudo docker image build -t elixir/XXXX .
#  * shell: sudo docker container run --rm -it --entrypoint "" -p 127.0.0.1:4000:4000 elixir/XXXX sh
#  * run:   sudo docker container run --rm -it -p 127.0.0.1:4000:4000 --name XXXX elixir/XXXX
#  * exec:  sudo docker container exec -it XXXX sh
#  * logs:  sudo docker container logs --follow --tail 100 XXXX
CMD ["start"]

Oh lordy this is a godsend, yesterday I went through the chore of upgrading from 1.6 alpha to 1.6 and it was painful. I had already used Bamboo and moving to runtime.exs was complex as a newbie

For reference, this is my full commit, if it helps anyone! Upgrade to Phoenix 1.6 · matteing/stack@f8a54bf · GitHub

Thanks for this guide. Are you able to use SCSS in a 1.6 project alongside tailwindcss? I’ve tried incorporating dart sass but it seems to interfere with tailwindcss.