Upgrading from v3.4.4 to v4.0.0 (using npm install react-scripts@latest) causes my local images (using src={require("../../assets/images/logo/logo-v4.png")}) to not load, however external images load. (see StackOverflow post here ) Fixed by simply downgrading to v3.4.4.
Tested using MacOS Catalina v10.15.7 and Windows 10 on Chrome Version 86.0.4240.111
In absolute terms, where are these images located? inside or outside the src folder?
Inside src folder
downgrade the version of react-scripts, thats works for me. I downgrade to 3.4.4 .
I recomend to downgrade react-scripts to 3.4.4 that bug does not happened anymore with that version, i hope that they fix that bug in the next patch
I have submitted a PR to fix this issue in #9934
try const logov4 = require("../../assets/images/logo/logo-v4.png").default or import logov4 from "../../assets/images/logo/logo-v4.png"
I don't know if this is the same issue but in 3.x this worked
+-public
| +-images
| | +-abc.svg
| +-index.html
+-src
+-app.js
+-app.css
Where app.js does import './app.css'; and app.css does foo { background url("/images/abc.svg"); }
Works in 3.x, fails in 4.0 with
./src/app.css
Error: Can't resolve '/images/abc.svg' in '/Users/gregg/temp/test/src'
@greggman how/have you fixed this?
For now I just reverted to 3.x I haven't had time to check if @n3tr 's patch is related or not
I have to use require('./to/img/a.png')?.default 馃槩
I can confirm this issue.
I tried to upgrade CRA 4.0.0 and images are not loaded.
+1 images are not loading after upgrading to react-scripts 4.0.0
same here, updated to react-scripts v4.0.0 and images are not loading anymore
all my img sources are in the src folder and I call them via src={require("./img/example.svg")}
React scripts v3.4.4 works fine
Most helpful comment
downgrade the version of react-scripts, thats works for me. I downgrade to 3.4.4 .