Ember JQuery UI import overrides JQuery $ Behaviour

I need JQuery UI for dragging and dropping objects in my Ember app. So, after installing via yarn, I import it in the project's ember-cli-build.js as follows:

app.import('bower_components/jquery-ui/jquery-ui.js', {
    using: [{ transformation: 'fastbootShim' }]
});

It gets loaded successfully and drag-drop works fine. However, the form functionality in other part of my codebase breaks with the following error:

TypeError: Ember.$.fn.form.settings is undefined

In this file, $ is imported from jQuery: import $ from 'jquery';

I suspect the import of jquery-ui overrides the behaviour of $ and causes this error. How do I fix this? Am I missing something obvious? Please help, I'm an Ember newbie.