jQuery 插件未定义，但已正确包含在我的 js 代码之前

Question

几天来我一直在研究这个非常奇怪的问题，我真的不明白为什么会这样。

基本上，环境是WordPress，我包括两个js文件：

vendor.js -> generated by gulp and all it does is concatenating bower libs together

myScript.js -> my code

我所知道的（有证据）：

供应商文件包含在我的代码之前（从控制台检查）
我正在使用的插件包含在vendor.js中（在chrome中的新选项卡中打开文件）
两个文件都正确加载（我打印了一些调试控制台日志，它们在控制台中）

但是即使我觉得一切都很好，但出于某种原因该插件仍然未定义。我使用的插件是这个：https://github.com/idiot/unslider

我在控制台中遇到的错误是：

Uncaught ReferenceError: unslider is not defined

这是我调用并需要此插件的代码部分：

jQuery(document).ready(function($) {
  console.log("unslider is ", unslider);
  $('#topBannerSlider').unslider({
    autoplay: true,
    delay: 10000,
    keys: true,
    nav: true,
    arrows: {
      prev: '<a class="unslider-arrow prev fa fa-arrow-circle-left"></a>',
      next: '<a class="unslider-arrow next fa fa-arrow-circle-right"></a>'
    }
  });

  $('#homePageTestimonialsCarousel').unslider({
    autoplay: true,
    delay: 20000,
    keys: true,
    nav: true,
    arrows: false
  });
}

如果我尝试在 jQuery(document).ready() 事件之前加载它，它也会执行相同的操作，如下所示：

console.log("unslider is ", unslider);
jQuery(document).ready(function($) {
  $('#topBannerSlider').unslider({
    autoplay: true,
    delay: 10000,
    keys: true,
    nav: true,
    arrows: {
      prev: '<a class="unslider-arrow prev fa fa-arrow-circle-left"></a>',
      next: '<a class="unslider-arrow next fa fa-arrow-circle-right"></a>'
    }
  });

  $('#homePageTestimonialsCarousel').unslider({
    autoplay: true,
    delay: 20000,
    keys: true,
    nav: true,
    arrows: false
  });
}

你有什么建议吗？我还能尝试什么？还能是什么呢？我真的被困住了，非常感谢任何帮助。非常感谢

Answer 1

如果我没听错，你说的是 WordPress，所以试试

jQuery 代替 $

我以前遇到过这个问题，现在已经解决了。

WordPress、PHP、JQuery 和 $ 不要混用 ;)。

jQuery 插件未定义，但已正确包含在我的 js 代码之前

jQuery plugin is undefined although is properly included before my js code

javascript

wordpress

jquery

jquery-plugins