Aurelia import library after library

Question

So, I'm new to Aurelia and JavaScript import syntax, and I'm working on an application that requires jQuery UI draggableand droppable. Since these widgets do not work on a mobile device, I need to use the jQuery UI Touch Punch library .

The problem I am facing is the following console error:

Uncaught TypeError: Cannot read property 'mouse' of undefined

It apparently appears when the jQuery UI Touch Punch library is loaded before the jQuery UI.

Here is how my file is configured aurelia.json:

"dependencies": [
      // ....
      {
        "name": "jquery",
        "path": "../node_modules/jquery/dist/",
        "main": "jquery"
      },
      {
        "name": "jquery-ui",
        "path": "../node_modules/jquery-ui-dist/jquery-ui",
        "deps": ["jquery"]
      },
      {
        "name": "touch-punch",
        "path": "../node_modules/jquery-ui-touch-punch/jquery.ui.touch-punch",
        "deps": ["jquery-ui"]
      }
    ]

And I have this import in my model:

import 'jquery-ui';
import 'touch-punch';

For some reason, everything is working fine, but I still have this console error.

, jQuery Touch Punch jQuery UI, , , .

Answer 1

, , touch-punch , . , Aurelia.

, jquery-ui-touch-punch . - <script> . , jquery-ui-touch-punch jquery-ui, jquery, . :

"name": "vendor-bundle.js",
"prepend": [
  "node_modules/bluebird/js/browser/bluebird.core.js",
  "node_modules/aurelia-cli/lib/resources/scripts/configure-bluebird.js",
  "node_modules/jquery/dist/jquery.js",
  "node_modules/jquery-ui-dist/jquery-ui.js",
  "node_modules/jquery-ui-touch-punch/jquery.ui.touch-punch.js",
  "node_modules/requirejs/require.js"
],
"dependencies": [
   ...
]

dependencies import.