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. https://rossta.net/talks/webpack-survival-guide-rails.html
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
2 Likes
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.
2 Likes