angular-ui/ui-sortable

element.sortable is not a function when using webpack

maciejszpyra opened this issue · 6 comments

maciejszpyra commented

I'm trying to use ui.sortable in my Angular project and I keep getting this error element.sortable is not a function. I'm using Angular 1.6.3 and Webpack. I tried to load this library in several ways and none works.

require('jquery-ui/ui/core'); require('jquery-ui/ui/widget'); require('jquery-ui/ui/widgets/mouse'); require('jquery-ui/ui/widgets/sortable');

Earlier I was using require('jquery-ui-sortable-npm') which has jQueryUI core and sortable pluging provided. I'm using selectize which is also using jQueryUI sortable and it works just fine. Does anyone succeeded to make this work?

thgreasi commented

I'm sorry it took me so long to reply.
Please take a look at #478

thgreasi commented

Any feedback on this?

maciejszpyra commented

I couldn't make it work. I tried everything and I end up not using this library.

yoannmoinet commented

I had the same issue, and it was painful.
Nothing worked...

EXCEPT !
Using the imports-loader to load the specific jquery-ui's module before ui-sortable.
Basically, in my webpack.config.js in config.module I added :

{
     test: /ui-sortable/,
     use: ['imports-loader?$UI=jquery-ui/ui/widgets/sortable']
}

And now, it's working.
I'm not sure to fully understand why I needed that, but it made it working for me.

  • 👍8
  • 🎉5
  • ❤️1
thgreasi commented

@yoannmoinet thanks for sharing. We might also have to add this in README as well. (PRs welcome!)

unclejustin commented

@yoannmoinet's solution worked for me as well.