CODEWITHSUNDEEP
ember.jsnpmember-cli
AJP
AJP

Reputation: 545

Ember cli - Cannot find module 'jquery' when importing NPM package using ember-browserify

I have installed the jscrollpane node module:

$npm install --save-dev jscrollpane

I have also installed ember-browserify, so that I can import npm modules into my ember components, as per this article.

I import the module into my component:

import Jscrollpane from 'npm:jscrollpane';

The module is found, but I get this error:

Error: Cannot find module 'jquery' from '/Users/username/my-app/node_modules/jscrollpane/script'

I have read this article which suggests adding jQuery to the relevant npm module (In this case my-app/node_modules/jscrollpane/script.).

It seems undesirable to add an additional copy of jQuery to a node module directory- is there a better way of making node modules aware of where to find the core Ember cli version of it?

Upvotes: 0

Views: 363

Answers (2)

AJP
AJP

Reputation: 545

I have since found Ember Perfect Scrollbar which does the same thing as jScrollpane, but works perfectly with Ember.

Upvotes: 0

user918510
user918510

Reputation:

I think jScrollPane is attempting to resolve a copy of jQuery loaded via AMD (https://github.com/aibarra988/jScrollPane/blob/master/script/jquery.jscrollpane.js#L68-L73). ember-cli uses a custom resolver which does not have jQuery exposed in the global scope. ember.js includes jQuery by default under Ember.$. quick ideas on solutions:

  1. write some kind of shim that exposes Ember.$ to jquery as jScrollPane expects by default
  2. find jScrollPane packaged for bower and import it within ember-cli-build.js (not "the best" but it works)
  3. embed a modified version of the file within vendor directory and import it using ember-cli-build.js. e.g. app.import('vendor/js/something.jquery.js'); If you want to do this the "right way", I suggest asking around in slack: https://embercommunity.slack.com/messages/-ember-cli/

Upvotes: 0

Related Questions