JQuery插件给出错误$（…）.ionRangeSlider不是一个函数
我正在尝试在我的反应中使用jquery插件。 每次我尝试使用一些jQuery的第三方插件，我得到一个错误说$（…）。somePlugin不是一个函数。 目前我正在尝试使用ionRangeSlider。 这是给我错误
Uncaught TypeError: (0 , _jquery2.default)(...).ionRangeSlider is not a function js文件
import $ from 'jquery' import 'bootstrap-tagsinput' class AddTagSection extends Component { componentDidMount=()=> { this.slider = $(this.inputSlider).ionRangeSlider(); } <div className="irs-wrapper"> <input type="text" ref={node=>this.inputSlider=node} className='input-slider' id="ionSlider-newTag" name="ionSlider"/> </div>
下面是在ionRangeSlider.js（插件）中调用的函数
$.fn.ionRangeSlider = function (options) { return this.each(function() { if (!$.data(this, "ionRangeSlider")) { $.data(this, "ionRangeSlider", new IonRangeSlider(this, options, plugin_count++)); } }); };
据我在网上阅读，这是一个多重的jquery冲突的问题。
关于我的应用程序：我的项目通过npm安装了jquery。 所以在package.json中有一个jquery。 我还在我的index.jade文件的脚本中包含了jquery。 所以还有另外一个
这不是jquery放在插件的js文件之后的问题。 我把jquery放在index.jade文件的脚本的最上面。
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')
我也试过noConfilct。 但是这也行不通。
var $ = jQuery.noConflict(); $( ".slider" ).ionRangeSlider();
我试图在我的webpack config.js文件中包含jquery
new webpack.ProvidePlugin({ React: 'react', $: 'jquery', jQuery: 'jquery' }),
没有从上面的工作。 每当我得到同样的错误。
我该如何解决这个问题？
尝试将内部url更改为针对rangeslider的外部url
<script src="http://ionden.com/a/plugins/ion.rangeSlider/static/js/ion-rangeSlider/ion.rangeSlider.js"></script> <link rel="stylesheet" href="http://ionden.com/a/plugins/ion.rangeSlider/static/css/ion.rangeSlider.css" />