CODEWITHSUNDEEP
javascriptreactjssasscreate-react-app
Sharpion
Sharpion

Reputation: 55

React trying to access file at a wrong path

I've created a React app using create-react-app and I can't eject it to change the webpack configs.

That being said, I'm trying to use index.scss as a hub and I'm importing all .scss files from sections folder. At _header.css, I have the following line working fine:

background-image: url(../img/bg_desktop.jpg);

But when I import it to the index.scss file:

@import './sections/header.scss';

React throws the following error:

Module not found: You attempted to import ../img/bg_desktop.jpg which falls outside of the project src/ directory. Relative imports outside of src/ are not supported.

When I change the path to "./img/bg_desktop.jpg" it doesn't find it either.. so it's working with neither relative path. Is there a way to fix this without ejecting the whole thing?

This is how it's structured:

enter image description here

Upvotes: 0

Views: 1596

Answers (1)

mckuok
mckuok

Reputation: 754

Use img/bg_desktop.jpg as ./ represents the current directory, which I believe can be changed during run time.

Upvotes: 1

Related Questions