title: Target container is not a DOM element - React and GatsbyJS - React-slick Component
body: <p>I am trying to use the <a href="https://github.com/akiran/react-slick" rel="nofollow noreferrer">React-Slick</a> carousel component but having issues getting it to display in app and receiving this error...</p>
  
  <blockquote>
    <p>Uncaught (in promise) Error: _registerComponent(...): Target container is not a DOM element.</p>
  </blockquote>
  
  <p><strong>featuresCarousel.js</strong></p>
  
  <pre><code>import React from "react";
  import ReactDOM from "react-dom";
  import { render } from "react-dom";
  import Slider from 'react-slick';
  
  
  class featuresCarousel extends React.Component{
    render() {
      const settings = {
        autoplay: true
      }
      return (
        &lt;div className='container'&gt;
          &lt;Slider {...settings}&gt;
            &lt;div&gt;Test&lt;/div&gt;
            &lt;div&gt;Test2&lt;/div&gt;
            &lt;div&gt;Test3&lt;/div&gt;
          &lt;/Slider&gt;
        &lt;/div&gt;
      );
    }
  };
  
  ReactDOM.render(
    &lt;featuresCarousel /&gt;,
    document.getElementById('container')
  );
  </code></pre>
  
  <p>should display in page section <strong>3-section.js</strong> which is then displayed in the page.</p>
  
  <pre><code>import React from 'react'
  import featuresCarousel from '../home/featuresCarousel'
  
  const SectionThree = (props) =&gt; (
      &lt;div&gt;
          &lt;featuresCarousel /&gt;
      &lt;/div&gt;
  )
  
  export default SectionThree
  </code></pre>
  
  <p>Not sure if it will make a difference but I am also using <a href="https://www.gatsbyjs.org/" rel="nofollow noreferrer">GatsbyJS</a>GatsbyJs and my knowledge of React is limited and very new.</p>