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

Question

I am using RequireJS to load dependencies.

Here is my configuration file:

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" } } }); 

And part of my main application file:

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

Checking Firebug, I see that all dependencies are loading. But calling typeahead() in the search text box displays the following message: "TypeError: $(...).typeahead is not a function"

I cannot understand this error as all dependencies are loaded (e.g. typeahead).

Can you help me? thanks in advance

Answer 1

What version of typeahead are you using?

If it is 0.11.1 :

The current version of typeahead (version 0.11.1) is incompatible with requirejs due to an incorrect module definition, see here: https://github.com/twitter/typeahead.js/issues/1211

From RequireJS docs :

The path used for the module name should not include the extension, since path mapping may be for the directory. The path mapping code will automatically add the .js extension when matching the module name with the outline.

A temporary workaround until the library is updated is to change where the library establishes compatibility with AMD.

The file extension must be omitted or otherwise requireJS will consider the path as an absolute path.

Edit:

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

in

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

We hope that the library will be updated soon, I hope this helps.

Answer 2

What if you use bootstrap3-typeahead ? See https://github.com/bassjobsen/Bootstrap-3-Typeahead/issues/106