From my 5 css files only app.css is being compiled to the static folder

In Phoenix 1.6 I have these files in the assets/css folder:

main.css
reset.css
variables.css
app.css
other.css

and in main.css I define what and in which order should be imported:

@import "./reset.css";
@import "./variables.css";
@import "./app.css";
@import "./other.css";

But in the result css file app.css in priv/static/assets only the content from app.css is present there.

The content of reset.css, variables.css and other.css are not there.

Why?

Do I need to tell Phoenix in some config files what my css files are?

In your ./assets/js/app.js you’ll find the line import "../css/app.css".
I think you want to change this to import "../css/main.css".

1 Like

Thanks. Will the Phoenix upgrade revert it back to app.css?

Also, while we are at it, do you use or know some minification tool - perhaps even for elixir/phoenix that will remove comments and spaces so the final css file is smaller.

Phoenix does never touch your files after they’re initially generated.

1 Like