src/images folder in create-react-app
What I normally do for assets under /public/assets
i import my files then in my react components using src i can access them using process.env.PUBLIC_URL + '/assets/{ENTER REST OF PATH HERE}'
here is a code sample how I implement it.
import React, { Component } from 'react';
const iconPath = process.env.PUBLIC_URL + '/assets/icons/';
export default class TestComponent extends Component {
constructor(props) {
super(props);
}
render(){
return (<img
src={`${iconPath}icon-arrow.svg`}
alt="more"
/>)
}
}
Here is the link that got me started implementing it this way. https://github.com/facebook/create-react-app/issues/2854
I also noticed you are importing logo incorrectly and should be import logo from '../images/logo.svg'
or if logo.svg does not have an export default you should be using import {logo} from '../images/logo.svg'
You can use ES6 import to locate any file (images, audio, etc) from the root folder and add them to your app.
import React from 'React'
import errorIcon from './assets/images/errorIcon.svg'
import errorSound from './assets/sounds/error.wav'
class TestComponent extends React.Component
{
render()
{
return (
<div>
<img src={ errorIcon }
alt="error Icon" />
<audio src={ errorSound } />
</div>
)
}
}