Importing modules


#1

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:

37%20PM

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


#2

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