Create React App images fail to load from the static media folder

Viewed 885

I've created the following simple app (under src/App.js):

import React from 'react';
import './App.css';

function App() {
    return (
        <header className="header">Header</header>
    );
}

App.css:

.header {
    padding: 2em;
    background-image: url('./img/header.jpg');
    background-size: cover;
    background-repeat: no-repeat;
}

The header.jpg is under src/img/header.jpg.

The Create React App build picks it up - and generates a build/static/media/header.b84cc87d.jpg file. I can see it it the file system if I run yarn build.

When I fire the app - the image is loaded in the css, I can see it, and it returns 200 - but the content fails to load for some reason. The other content served from static, ie the js and css all load fine.

I'm trying to run this using dev mode - but even with production and serve -s it fails.

enter image description here

What I am doing wrong?

0 Answers
Related