我的 dropkick js 已加载，但 javascript 说 dropkick 不是函数答案

【问题标题】：My dropkick js is loaded but javascript says dropkick is not a function我的 dropkick js 已加载，但 javascript 说 dropkick 不是函数
【发布时间】：2020-07-20 15:28:19
【问题描述】：

我加载了dropkick js，当我加载页面查看页面源时我可以确认它

<script src="/core/assets/vendor/jquery/jquery.min.js?v=3.2.1"></script>
<script src="/core/assets/vendor/jquery/jquery-extend-3.4.0.js?v=3.2.1"></script>
<script src="/themes/custom/amarula/assets/libs/dropkick.min.js?q8gncy"></script>
<script src="/themes/custom/amarula/assets/js/main.js?q8gncy"></script>
<script src="//cdn.jsdelivr.net/bxslider/4.2.12/jquery.bxslider.min.js"></script>

以下是我的 yml 文件中的内容：

global-css:
  css:
    theme:
      assets/css/style.css: {}
      assets/css/libs/dropkick.css: {}
      //cdn.jsdelivr.net/bxslider/4.2.12/jquery.bxslider.css: {}

global-js:
  js:
    assets/libs/dropkick.min.js: {minified: true}
    assets/js/main.js: {}
    //cdn.jsdelivr.net/bxslider/4.2.12/jquery.bxslider.min.js: {}
  dependencies:
    - core/jquery

在我的 main.js 中：

$('.serve-amount').dropkick();

这是我的选择标签：

<select name="serve-amount" class="serve-amount">
  <option value="{{ content.field_recipe_serve_amount }}">{{ content.field_recipe_serve_amount }}</option>
</select>

检查页面时，我看到以下错误：

jquery.min.js?v=3.2.1:2 Uncaught TypeError: $(...).dropkick is not a function

如何在我的选择标签中使用 dropkick？

【问题讨论】：

标签： jquery drupal-8 jquery-dropkick

【解决方案1】：

假设assets/js/main.js是你自己的附加JS文件。

您能否尝试拆分您的库和第三方库，然后将 dropkick.js 添加为依赖项：

global-js:
  js:
    assets/js/main.js: {}
    //cdn.jsdelivr.net/bxslider/4.2.12/jquery.bxslider.min.js: {}
  dependencies:
    - core/jquery
    - your_module/dropkick.js

dropkick.js:
  js:
    assets/libs/dropkick.min.js: {minified: true}
  dependencies:
    - ...

【讨论】：