React owl.carousel $ не определено

Я создал приложение, используя приложение create-response-app. Я импортировал модуль jquery в компонент, а также owl.carousel, но почему он показывает ошибку.

Вот код компонента

import React,{Component} from 'react';

import $ from '../../../node_modules/jquery/dist/jquery.min'
import '../../../node_modules/owl.carousel/dist/owl.carousel'

import '../../../node_modules/owl.carousel/dist/assets/owl.carousel.min.css'

class Header extends Component{

    componentDidMount() {
    }

    render(){
        return(
            <div className = "owl-carousel">
                <div>Content 1</div>
                <div>Content 2</div>
                <div>Content 3</div>
                <div>Content 4</div>
                <div>Content 5</div>
                <div>Content 6</div>
                <div>Content 7</div>
            </div>
        )
    }
}

Невозможно прочитать свойство undefined. Снимок экрана с ошибкой