Check the render method of IdealImage.

[rotexhawk]

• react-ideal-image version:
  v0.0.5

• node version:
  v12.10.0

• npm (or yarn) version:
  yarn 1.15.2

Relevant code or config

import React from 'react';
import { Container, ImageContainer } from '../Containers'
import IdealImage from 'react-ideal-image'
import image from './image.jpg';

const imgUrl = 'http://localhost:4000/public/images/raw/20190810_121340_HDR.jpg'

console.log('image', image)
const GridFive = () => {
    return  <Container>
                <ImageContainer>
                    <IdealImage placeholder={{color: 'black'}} srcSet={[{src: image, width: 500} ]} width={800} height={800} />
                </ImageContainer>
            </Container>;
}

export default GridFive;

I don't know what I am doing wrong. At first I thought that the package doesn't work with remote urls, but I imported the image and I still get the follow error. If I remove the ideal image and just use img src everything works.

Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

Check the render method of `IdealImage`.

[frednomoon]

Yeah I'm getting this as well. Tried using the exact same props etc as in the example of the readme.

Update: took me about 5 seconds to fix this after reading other issues. Its caused by react-waypoint v9 so just need to specify v8 in your package json. I would suggest the maintainers start handling their Peer Dependencies correctly in response to this instead of requiring people to manually install them. Or at least add this correction to the docs.