Phoenix 1.6.0 LiveView + esbuild + Tailwind JIT + AlpineJS - A brief tutorial

Has anyone successfully made a Dockerfile integrating his deploy script? I tried generating a mix release.init but for some reason the start command does not seem to get called.

gist:

Put the file anywhere in the config directory and when add the path to the esbuild key in config.exs

~w(js/app.js css/custom.css --bundle --loader:.woff2=file --loader:.woff=file --target=es2016 --outdir=../priv/static/assets)

Sharing this here…tailwind with esbuild and phx1.6 WITHOUT the tailwind cli. Uses a build file for esbuild (and the esbuild api). I find this approach much cleaner than having a lot of npm commands everywhere. Also gives you more flexibility with bundling your static assets (the esbuild cli can get long and unwieldy if you are trying to load font files, etc)

2 Likes

I checked out the repo for a sec. Do you see what more there might be to do beyond adding “html-heex” and/or “HTML (HEEx)” into the list of languages?

I didn’t tried anything on that front due to my work busy,

Hello @sergio !
Silly question. In this deployment, where does phoenix logs are stored? I deployed the application on an EC2 instance - and - simply could not locate the logs. I am getting an error message - and - unable to locate the logs to trace the error.

fyi to other readers, it has been added: tailwindcss-intellisense/languages.ts at 0f4d93b96e8d82d42de07477e9be9f0655ccdb5c · tailwindlabs/tailwindcss-intellisense · GitHub

3 Likes