1

我加载了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？

4

1 回答 1

0

假设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:
    - ...
于 2020-04-08T12:29:24.143 回答