taginput не является функцией

Question

Я пытаюсь использовать bootstrap-tagsinput в моем приложении реакции. Я включил скрипт ввода bootstrap-тегов в мой файл index.jade. Я получаю сообщение об ошибке

AddTagSection.js:102 Uncaught TypeError: (0 , _jquery2.default)(...).tagsinput is not a function

Это мой файл index.jade

extends layout


block head_scripts

        script(src='https://code.jquery.com/jquery-3.2.1.min.js')
        script(src='/public/ion.rangeSlider.js')
        link(href='/public/normalize.css' rel="stylesheet")
        link(href='/public/ion.rangeSlider.css' rel="stylesheet")
        link(href='/public/ion.rangeSlider.skinFlat.css' rel='stylesheet')
        script(src="/public/bootstrap-tagsinput.js")
        link(href="/public/bootstrap-tagsinput.css")

Моя строка кода также не выделяет tagsinput().

Он мой код. Я хочу показать, что плагин ionRangeSlider работает, но taginput не работает (с ошибкой, упомянутой выше).

    componentDidMount = () => {
            $(this.slider_el).ionRangeSlider();
            this.slider = $(this.slider_el).data('ionRangeSlider')
             $(this.tag_input_el).tagsinput()

        }



 <div className="irs-wrapper">
                            <input
                                ref={node => this.slider_el = node}
                                type="text"
                                id="ionSlider-newTag"
                                name="ionSlider"
                                value="0;2057"/>
                        </div>
                        <br/>
                        <div className="form-group form-group-default">
                            <label>Tags</label>
                            <input ref={node => this.tag_input_el = node}
                                   id="tagsinput"
                                   type="text"
                                   value="Smoking,Drinking"
                                   data-role="tagsinput"/>
                        </div>