aswinmohanme
I started a project with Pheonix 1.6 rc. Everything is going great and the new esbuild pipeline is so fast and a joy to work with. I cannot find out how to display an hero image on home screen.
I added the file to assets/static/images/hero-image.svg here is my image tag
<img class="rounded-2xl" src="/images/hero-image.svg">
I have added the SVG loader to esbuild in config.exs
config :esbuild,
version: "0.12.18",
default: [
args:
~w(js/app.js js/draft-editor.js js/book-long-description-html-editor.js js/chapter-render.js static/fonts/fonts.css --bundle --loader:.otf=file --loader:.svg=file --target=es2016 --outdir=../priv/static/assets),
cd: Path.expand("../assets", __DIR__),
env: %{"NODE_PATH" => Path.expand("../deps", __DIR__)}
]
What am I doing wrong ? How do I get the image to be displayed on home screen ? Thanks
Where Next?
Trending in Discussions
Other Trending Topics
Latest Phoenix Threads
Latest on Elixir Forum
Sponsor Spotlight
Error tracking, logs, APM, uptime and cron monitoring in one dev-friendly platform. Find and fix problems before your users notice.
Categories:
Sub Categories:
Forums
Popular Tags
- #ecto
- #liveview
- #troubleshooting
- #learning-elixir
- #library
- #deployment
- #erlang
- #testing
- #genserver
- #mix
- #absinthe
- #remote-other
- #otp
- #plug
- #how-to-question
- #macros
- #postgres
- #elixirconf
- #channels
- #exunit
- #discussion
- #code-sync
- #podcasts
- #javascript
- #onsite
- #dialyzer
- #docker
- #authentication
- #umbrella
- #full-time-contract
- #podcasts-by-brainlid
- #ecto-query
- #elixirconf-us
- #ai
- #blog-post
- #elixir-ls
- #phoenix_html
- #iex
- #graphql
- #genstage
- #websockets
- #supervisor
- #advent-of-code
- #distillery
- #processes
- #api
- #forms
- #metaprogramming
- #hex
- #security
Our Sponsors
Supporting innovation across the BEAM ecosystem.
We build reliable cloud platforms for business-critical systems.
Catch errors, track performance, monitor hosts and more.
Error tracking, logs, uptime, and Just Enough APM. Built for developers.
Elixir, Erlang & BEAM conferences from Code Sync - join us in 2026!
Practical resources that improve the lives of professional developers.
Master modern tools, write cleaner code, and tackle real-world challenges.
The deployment platform built for Elixir: PaaS ease, VPS control.
The team behind Membrane, Popcorn, LiveDebugger. Available for hire.
Courses that'll move you from confusion to "Aha, now I get it!"
Showing Posts 1 to 3- Show Best Posts
- Show All (oldest first)
- Show All (newest first)
nikolauska
Are you importing that svg file in the javascript code or just using it in the src? If you’re not importing image in the code it won’t be build, but will just be a regular static file that needs to be copied separately to
priv/staticfolder. With the new esbuild setup there is no longer automatic copying fromassets/statictopriv/staticso you need to move them there for them to work.aswinmohanme
Yes that was the issue, I put the image in
priv/static/imagesand it worked like a charm. Thanksthiagomajesk
@aswinmohanme If you still want to keep using Esbuild because it’s fast but want a little less hustle to configure everything else (like the old default experience), try configuring Vite in your asset pipeline - compared to Webpack it’s a piece of cake, and you’ll get asset copying working as per usual.