Importing modules

Hello everyone,

While transferring my javascript code to stimulus controllers I got stuck twice. First I got stuck when importing jquery autocomplete which I was able to solve by importing autocomplete using the full path and then attaching it to an element like this:


Importing autocomplete this way fixed my issue. But after some time I came upon the same issue but with another module. This time its chosen-js. I tried importing the same way as above but no luck. Example:

import "chosen-js/chosen.css"
import "chosen-js/chosen.jquery"

The error I’m getting:

TypeError: __WEBPACK_IMPORTED_MODULE_1_jquery___default(...)(...).chosen is not a function

1 Like

Not sure if it can help but I have been struggling in the past with jQuery/Webpack configuration (in a non stimulus application).

I have watch the excellent talk from Rossta at Rails Conf 2018 and since them follow his advices to the letter.

The first part of the video talk explains really well the traps you can get into.

His solution is to use the expose-loader package

I think I ended up adding this line to my application.js

import "expose-loader?$!jquery";

Just in case a good alternative chosen-js without jQuery is choices js


Have you found a solution yet? I’m struggling with this problem and the only reference to it, that I could find, was this topic.

You are a lifesaver.

I had an issue where rendering js partials in Rails 6, and chosen() function was not recognized in them, getting the following error in browser inspect window:

Uncaught TypeError: $(...).chosen is not a function at HTMLDocument.<anonymous>

This line is the solution.