How can I require a image without using [%raw ]

#1 
let src : string = [%raw "require('./img/img.png')"];
let component = ReasonReact.statelessComponent("Header");

let make = (_children) => {
  ...component,
  render: self =>
    <div>
      <img src=(src) />
    </div>,
};

the code works but it would be great if I can do the first line without using [%raw "..."]

I’ve tried to look for that information and unfortunately, I couldn’t find any yet.

Does any know how to do it?

FYI, also How to import svg file? didn’t work for me

#2

Try it

[@bs.module]
external src : string = "./img/img.png";
let component = ReasonReact.statelessComponent("Header");

let make = (_children) => {
  ...component,
  render: self =>
    <div>
      <img src=(src) />
    </div>,
};
#3 
[@bs.val] external require: string => unit = "";
require("./img/img.png");
Including a directory with many images in ReasonReact
#4

@aria Thanks! But string => unit should be string => string` in my case

#5

@maarekj Thanks!
How can I require a image without using [%raw ] works well.
one very minor issue is that bsb change its name to something like ImgPng instead of keeping src in compiled JS code which you can check it here: https://reasonml.github.io/en/try?rrjsx=true&reason=NoAQRgzgdAtg9gEwK4BsCmBdABGgHgFzQCcA7AQxSwiIGMsAuK-IgSxIHMsBeLAIgDMIvANxYA9ACosSCG04ADQfKxsIhMgiz44WMgDc4LTcSJwiWCWIBQ6fFhpwYABzgk0JOzwBKaMhFc+ZDT4UGpkhOgQEADCji5uHgAUvAASvgjEvACUwlY2aHYwZADWaNxYiQD6NAAWLCgIRO5Z3AB8WADeVlhYUH0Ozq7u+AA03VhNJBlEjJUQaCj8beM9ADwILHqtKz1YqywwnNQ0XInHLWLbu3tiG1tjAL7CQA

#6

Awesome!