Search code examples
reactjsreact-routercreate-react-app

Create React App - routing change images path

I'm creating a simply lightbox with create-react-app and I found one big issue that is bringing me some problems. I have in public folder some images. In root public folder I have spinner file Spinner-white.svg and I'm creating gallery on page localhost:3000/other When I am on this page all images that I want to add must be in folder /other but I'm using this Spinner somewhere else and I don't want to copy it on every folder that match my route path. localhost:3000/other2 for this path I need to create other folder /other2 and paste Spinner here.

I fixed this issue on production version but I cannot find answer in development.

Fixing for production:

{
   id: 1,
   url: process.env.PUBLIC_URL + '/other/3.jpg'
}

and in client package.json

"homepage": "path_to_domain",

Screen of my network tab:

enter image description here

Solution

  • Hope you are doing well.

    For your issue, you have to introduce the base path in .env file. With help of base path, your case to access the spinner wherever you want.

    Hope it will help you. create-react-app build with PUBLIC_URL