TypeScript x CRA: require for images #9720
Unanswered
sumanthratna
asked this question in
Q&A
Replies: 2 comments 2 replies
-
wow...I don't think this is a JS vs TS issue; this is a CRA 3 vs CRA 4 issue. filing an issue now. |
Beta Was this translation helpful? Give feedback.
0 replies
-
Not sure if this helps, but I had a case where I combined const imageAsset = useRef();
useEffect(() => {
try {
imageAsset.current = require(`../../../images/sponsors/normal/${logo}`);
} catch (e) {
console.error(e);
}
}, [logo]); <img
id={`img-normal-${sponsorID}`}
src={imageAsset.current}
/> |
Beta Was this translation helpful? Give feedback.
2 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
Hi! I imagine this is a very common question, but I haven't found any solutions online. Using JSX, I can do:
which works as expected.
with TSX, I'm trying:
where logo is a string specifying the filename.
but when I run
yarn start
, the images aren't loading because thesrc
attribute is populated with[object Module]
, not the path to the static file. When I runyarn build
, the images are copied to the static/media folder.I've tried
import image from imagePath;
but that raised an error because imports need to be at the top of the file. I also triedconst image = require(imagePath);
but that didn't resolve the error.Does anyone know how to solve this issue?
Beta Was this translation helpful? Give feedback.
All reactions