How to use images in the resources folder in a re-frame, re-agent app?

user_5440125 0
Viewed 421

I have an app created using Chestnut, and there's an image in the project in the location: resources/public/img.png. I want to use this image in my app, but doing [:img {:src "public/img.png"}] or [:img {:src "./img.png"}] doesn't work. What's the correct src for the image in the resources folder?

clojurescript clojure html
3 Answers

The directory part resources/public is implicit. You need to access the file like:

(ns demo.core
  (:require [clojure.java.io :as io]))

  ; something like this
  (slurp       (io/resource "img.png")) ; returns bytes from file
  (io/stream   (io/resource "img.png")) ; returns in InputStream for file

for example:

(ns tst.demo.core
  (:use tupelo.core tupelo.test)
  (:require [clojure.java.io :as io]))

(dotest
  (let [bytes (slurp (io/resource "sample.json"))]
    (spyx (count bytes))))

with result

(count bytes) => 72
user_18223790

Go to your project.clj file and search for figwheel settings. Make sure that :http-server-root is uncommented. 

:figwheel {
             :http-server-root "public"       ;; serve static assets from resources/public/

...

}

Then [:img {:src "img.png" }] should work. And don't forget to restart figwheel.

user_7151060

I have not used Chestnut. I'm assuming there is a webserver running, whose root dir is resources/public. I'm presuming there is a index.html (or equivalent) in that folder. I further assume that the Hiccup you want is in that index.html file. Given all of the above, I'd try

[:img {:src "img.png"}]

user_130901460
Related