Search code examples
jquery-uiwebpackcommonjs

jQuery 1.12 full (CJS/webpack)?


jQuery UI 1.12 appears to backwards incompatible with jQuery UI 1.10 (hurray!). They've shuffled all their code around and now their "main" bundle only includes $.widget but not the actual widgets like $.datepicker.

Specifically, inside package.json you'll find

"main": "ui/widget.js",

This tells build tools like webpack where to find the main file for inclusion. However, ui/widget.js doesn't include the rest of the components like it did before.

Normally this isn't such a big deal, and I can just hack around it by modifying my webpack.config.js to point to the real main file, except that I can't find it!

Is there a main/bundle file included in the npm version of jQuery 1.12?


Solution

  • This pull request's discussion gave me the information I needed.

    https://github.com/jquery/jquery-ui/pull/1600

    What I learned is with jquery-ui 1.12.0, there's no more main file that imports everything. In my case I only needed either ui/widget.js or the button widget (jquery-ui/ui/widgets/button). I pointed to them directly and it worked for me.

    In your case, you should be fine requiring your datepicker like this:

    require('jquery-ui/ui/widgets/datepicker');
    

    It's kinda good actually. You don't need to bundle all of jquery-ui to inherit one component you're using.