# Ember auto import & Jquery Plugins?

**URL:** <https://discuss.emberjs.com/t/ember-auto-import-jquery-plugins/18414>\
**Category:** Build Issues\
**Created:** [December 10, 2020, 6:40pm UTC](https://discuss.emberjs.com/t/ember-auto-import-jquery-plugins/18414 "2020-12-10T18:40:19Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![zinhart](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/zinhart/32/17088_2.png) [@zinhart](https://discuss.emberjs.com/u/zinhart)\
**Post date:** [December 10, 2020, 6:40pm UTC](https://discuss.emberjs.com/t/ember-auto-import-jquery-plugins/18414/1 "2020-12-10T18:40:19Z")

</div>

Good Afternoon Everyone,

My team has a number of jquery plugins that we would like to use in our application.

- Slimscroll

- popover

- tooltip

- Select2

- TreeJs

- Flotcharts

etc…  
What is the way one goes about incorporating these plugins into a project in Ember **with the jquery integration enabled as detailed [here](https://guides.emberjs.com/release/configuring-ember/optional-features/)?** I was under the impression **ember-auto-import** performs some magic to make this painless.

I should note we are also using [Apex Charts](https://apexcharts.com/) , for which **ember-auto-import** does indeed work its magic.

Also in case it’s relevant we are using ember-cli-typescript.

---

<div class="post-metadata">

**Author:** ![dknutsen](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/dknutsen/32/16471_2.png) [@dknutsen](https://discuss.emberjs.com/u/dknutsen)\
**Post date:** [December 10, 2020, 6:53pm UTC](https://discuss.emberjs.com/t/ember-auto-import-jquery-plugins/18414/2 "2020-12-10T18:53:39Z")

</div>

I’m not sure if this is the best way but you can always import stuff like that in your `ember-cli-build.js` e.g. from our app:

```auto
  ...
  app.import('node_modules/jquery-ui/ui/core.js');
  app.import('node_modules/jquery-ui/ui/widget.js');
  app.import('node_modules/jquery-ui/ui/mouse.js');
  app.import('node_modules/jquery-ui/ui/resizable.js');
  app.import('node_modules/jquery-ui/ui/slider.js');
  app.import('node_modules/jquery-ui/ui/sortable.js');
  ...

```

I generally use ember-auto-import for more modern modules or anything i want to load lazily.

---

<div class="post-metadata">

**Author:** ![ef4](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/ef4/32/13470_2.png) [@ef4](https://discuss.emberjs.com/u/ef4)\
**Post date:** [December 11, 2020, 4:13pm UTC](https://discuss.emberjs.com/t/ember-auto-import-jquery-plugins/18414/3 "2020-12-11T16:13:26Z")

</div>

This is an ember-auto-import FAQ:

> **[GitHub - ef4/ember-auto-import at d748424fff05b449bc3d1dd3d06cf3283f55970c - I'm trying to load a jQuery plugin, but it doesn't attach itself to the copy of jQuery that's already in my Ember app.](https://github.com/ef4/ember-auto-import/tree/d748424fff05b449bc3d1dd3d06cf3283f55970c#im-trying-to-load-a-jquery-plugin-but-it-doesnt-attach-itself-to-the-copy-of-jquery-thats-already-in-my-ember-app)**
>
> d748424fff05b449bc3d1dd3d06cf3283f55970c

---

<div class="post-metadata">

**Author:** ![zinhart](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/zinhart/32/17088_2.png) [@zinhart](https://discuss.emberjs.com/u/zinhart)\
**Post date:** [December 12, 2020, 10:38am UTC](https://discuss.emberjs.com/t/ember-auto-import-jquery-plugins/18414/4 "2020-12-12T10:38:59Z")

</div>

Indeed a couple hours after posting the question I came across the bit about jquery plugins in [your link](https://github.com/ef4/ember-auto-import/tree/d748424fff05b449bc3d1dd3d06cf3283f55970c#im-trying-to-load-a-jquery-plugin-but-it-doesnt-attach-itself-to-the-copy-of-jquery-thats-already-in-my-ember-app).

Thank you all.