That is not how the PUBLIC_URL variable is used. According to the documentation, you can use the PUBLIC_URL in your HTML:
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
Or in your JavaScript:
render() {
// Note: this is an escape hatch and should be used sparingly!
// Normally we recommend using `import` for getting asset URLs
// as described in “Adding Images and Fonts” above this section.
return <img src={process.env.PUBLIC_URL + '/img/logo.png'} />;
}
The PUBLIC_URL is not something you set to a value of your choosing, it is a way to store files in your deployment outside of Webpack's build system.
To view this, run your CRA app and add this to the src/index.js
file:
console.log('public url: ', process.env.PUBLIC_URL)
You'll see the URL already exists.
Read more in the CRA docs.