CSS from JS packages not loaded with ESbuild

Phoenix Forum Questions / Help
, ,
1

I’m currently making the Webpack → ESbuild upgrade with Phoenix 1.6, and I don’t understand how to load CSS from external JS packages.

For example, I use this npm package called GlideJS, and its looks like it work just fine but without CSS! Here is my App.js :

import Glide from "./hooks/glide";
import "@glidejs/glide/dist/css/glide.core.css";
import "@glidejs/glide/dist/css/glide.theme.css";

Everything builds without error, Tailwindcss works like a charm… What am I doing wrong?

2

Never used glidejs but shouldn’t the css imports go in the app.css file?

3

I tried both import in App.js and @import in App.css and neither work :confused:

4

I don’t think esbuild handles css building. You said you use tailwindcss, likely with a postcss toolchain. I think you need to use postcss import

1 Like