Importing NPM-installed Libraries for Usage in Ember.js

Question

Inside my component, I have

  didInsertElement: function() {

    $('#' + this.idVal).tokenfield({
      autocomplete: {
        source: ['red','blue','green','yellow','violet','brown','purple','black','white'],
        delay: 100,
        minLength: 1,
      },
      showAutocompleteOnFocus: true
    });

I am trying to use the npm package https://www.npmjs.com/package/bootstrap-tokenfield.

However, I noticed that $().tokenfield() is undefined meaning that I am not importing it properly. I tried adding it to the ember-cli-build.js but I noticed that it is probably importing bootstrap-tokenfield before jquery which causes issues. (Is this the case the ember.build.js imports those files before any dependencies?)

Am I supposed to import bootstrap-tokenfield in the component somehow if I am trying to use it with npm install?

I am using Ember 2.1.0.

Bek · Accepted Answer · 2015-12-04 04:42:57Z

1

if you want to import npm package to ember client side code you can use ember-browserify (https://github.com/ef4/ember-browserify), inside your project you can simply do

import MyCoolModule from "npm:my-cool-module";

answered Dec 4, 2015 at 4:42

Bek

3,2051 gold badge19 silver badges28 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

James Lam Over a year ago

Thanks Bek, I will give it a try. So I noticed that for example jquery is available to the Ember client code. What JavaScript libraries are available by default?

Bek Over a year ago

By default only jquery available, but you can add any clientside libs with bower then you will need import them in ember-cli-build.js file more info here (ember-cli.com/managing-dependencies)

James Lam Over a year ago

Thanks, really appreciate the help. How do I know where the module is getting pulled from? For example, I get the following: Cannot find module 'jquery' from '/node_modules/jquery-ui'. In my component, I have import jQueryUI from "npm:jquery-ui";. Why is it looking for the module jquery?

Collectives™ on Stack Overflow

Importing NPM-installed Libraries for Usage in Ember.js

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related