create react app not loading css background images in dev or build

Question

I\'m having difficulty with some background images not loading. I\'ve made some significant modifications to the initial create react app, my folder structure is now as follows

Answer 1

The issue was purely an issue with CSS in the App.css file:

App.css

.trees__tree {    
    background: url('../images/tree.png') no-repeat;
    background-size: 30px; /** moved this property down */
    float: left;
    height: 50px;
    width: 30px;
}

Answer 2

My issue was specifically that I did not have background-size: 30px; defined. Thanks for this.

Answer 3

Add homepage in package.json to run build in any apache server

{
  "name": "app",
  "version": "0.1.0",
  "private": true,
  "homepage": "http://{servername}/{foldername}/",

}

then create build in react using

1. npm run build
2. npm install -g serve
3. serve -s build
4. Copy build folder and paste in server like xampp/htdocs and hit url