TypeError: $(...).typeahead is not a function with RequireJS

Question

我正在使用 RequireJS 来加载我的依赖项。

这是我的配置文件：

requirejs.config({
  baseUrl: "/js/dist",
  paths: {
    jquery: "../bower_components/jquery/dist/jquery.min",
    bootstrap: "../bower_components/bootstrap/dist/js/bootstrap.min",
    typeahead: "../bower_components/bootstrap3-typeahead/bootstrap3-typeahead.min",
    validator: "../bower_components/bootstrapvalidator/dist/js/bootstrapValidator.min",
    openlayers: "../vendor/openlayers/OpenLayers"
  },
  shim: {
    bootstrap: {
      deps: ["jquery"]
    },
    validator: {
      deps: ["bootstrap"]
    },
    openlayers: {
      exports: "OpenLayers"
    }
  }
});

以及我的主要申请文件的一部分：

define(["jquery", "bootstrap", "openlayers", "./popup", "typeahead"], function($, Bootstrap, OpenLayers, Popup) {
   (...)
   $("#textSearch").typeahead("destroy");
   (...)
});

使用 Firebug 检查，我可以看到所有依赖项都已加载。但是在我的搜索文本框中调用 typeahead() 会输出以下消息："TypeError: $(...).typeahead is not a function"

我无法找出这个错误，因为加载了所有依赖项（预先输入也是如此）。

你能帮帮我吗？提前致谢

Answer 1

如果您使用 bootstrap3-typeahead 而不是密钥 typeahead 会怎样？参见 https://github.com/bassjobsen/Bootstrap-3-Typeahead/issues/106

Answer 2

您使用的是哪个版本的 typeahead？

如果是0.11.1:

当前版本的 typeahead（版本 0.11.1）由于模块定义不正确而与 requirejs 不兼容，请参见此处：https://github.com/twitter/typeahead.js/issues/1211

来自 RequireJS docs：

用于模块名称的路径不应包含扩展名，因为路径映射可能用于目录。路径映射代码在将模块名映射到路径时会自动添加.js扩展名

在库更新之前的一个临时解决方法是更改库设置它的 AMD 兼容性的位置。

文件扩展名应该省略，否则requireJS会认为路径是绝对路径。

变化：

define("typeahead.js", [ "jquery" ], function(a0) {

至：

define("typeahead", [ "jquery" ], function(a0) {

希望图书馆能尽快更新，同时，希望这对您有所帮助。

TypeError: $(...).typeahead is not a function with RequireJS

TypeError: $(...).typeahead is not a function with RequireJS

javascript

jquery

requirejs

twitter-bootstrap-3