How to install typeahead via webpacker and rails 6

Viewed 248

I'm trying to install typeahead.js to my rails 6 app via webpacker but I'm getting this error in the web browser console: .typeahead is not a function

This is what I did:

yarn add typeahead.js

javascript/packs/application.js

require("typeahead")

webpack/environment.js

const { environment } = require('@rails/webpacker')

const webpack = require('webpack')
environment.plugins.append('Provide', new webpack.ProvidePlugin({
  $: 'jquery',
  jQuery: 'jquery',
  Popper: ['popper.js', 'default'],
  Bloodhound: 'typeahead.js/dist/bloodhound.js'
}))

const aliasConfig = {
  'typeahead': 'typeahead.js/dist/typeahead.jquery.js'
};

environment.config.set('resolve.alias', aliasConfig);

module.exports = environment

and the js code for this:

 var items = new Bloodhound({
    datumTokenizer: Bloodhound.tokenizers.whitespace,
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    remote: {
        url: '/dsearch/autocomplete?search=%SEARCH',
        wildcard: '%SEARCH'
    }
});

application.css

@import "typeahead";

Any ideas what I might be doing wrong here?

0 Answers
Related