How to include multiple JS and CSS files in app.html.eex Phoenix

Question

I am using VueCLI3 within Phoenix, and switched to SplitChunk feature of webpack4. Through which In past I was creating only 1 app.js and app.css file, but after enabling splitChunk feature now there are almost 5 CSS files and 10 js files.

All are placed in /priv/static/js and /priv/static/css.

I have been using this to include single CSS and JS file such as

<script type="text/javascript" src="<%= Routes.static_path(@conn, "/js/app.js") %>"></script>

How I can loop through all JS files and include them at once?

Answer 1

Top of my head, you could do something like:

<%= for file <- Path.wildcard("../priv/static/js/*.js") do %>
    <script type="text/javascript" src="<%= Routes.static_path(@conn, file) %>"></script>
<% end %>

But I do have a gut feeling there might be a bigger problem here than this. It feels hacky.