从供应商文件导入后，如何提前调用jQuery？

Question

我正在Webpack中导入jQuery Typeahead（http://www.runningcoder.org/jquerytypeahead/），并且确实导入成功，但是当我调用该函数时，它会产生错误。

奇怪的是，如果我将供应商文件包含在应用程序目录中，它将正常工作。

直接在导入后，如果我执行console.log（window.Typeahead），它会显示版本号，因此我确定它已被加载。

import $ from "jquery"

window.jQuery = $

import "jquery-typeahead"

;(function() {
  function createTypeahead(el) {
    let field = $(el)
    let data = field.data()
    field.typeahead({
      minLength: 2,
      order: "asc",
      dynamic: true,
      delay: 500,
      emptyTemplate: "no result for {{query}}",
      source: {
        agents: {
          display: ["first_name", "last_name", "email"],
          templateValue: "{{first_name}} {{last_name}}",
          ajax: function(query) {
            return {
              type: "GET",
              url: data.url,
              data: {
                q: "{{query}}",
              },
            }
          },
        },
      },
      callback: {
        onClick: function(node, a, item, event) {
          let typeaheadFor = data.typeahead
          if (typeaheadFor !== undefined && item["id"].length) {
            $("#" + typeaheadFor).val(item["id"])
          }
        },
      },
    })
  }

  $(".js-typeahead").each(function(i, el) {
    createTypeahead(el)
  })
})()

加载页面时，在控制台中出现以下错误：

Uncaught TypeError: field.typeahead is not a function