I’d like to import an existing ES6 module into my app. If I copy it anywhere into the app folder, it works fine with a relative import path.
import test from '../utils/file';
However, if the file is in vendor or bower_components or node_modules, I get a “could not find module” error.
import test from 'vendor/file';
This issue is a bit old, but it gives the impression that this should work. Is there a solution for this?
Why don’t you just import it inside the brocfile.js. that should create the reference for you: app.import(‘bower_components/…’);
I tried that - but I get an “unexpected reserved word” error because the ES6 module doesn’t get transpiled.
The last comment on that issue says that shouldn’t be needed.
Between this issue and the fact that you also can’t pull in unnamed AMD/UMD modules (which are very common) - it seems incredibly difficult to pull 3rd-party modules into Ember CLI.
Just curious any reason why this module needs to sit in the node_modules?
The 2 approaches I have taken to this problem is one
util/plugin.js
import Ember from 'ember';
//Manages an object ajax request
import 'project/utils/plugins/apiRequest';
//Sets an active class to or takes away from targeted div
import 'project/utils/plugins/toogleActive';
//vaildate product fields
import 'project/utils/plugins/validateProduct';
Then of course I can reference those modules when i need them
import '../utils/plugins';
I’m not sure if this is the best route just the only one I have found to work. Im not exactly sure this fits your use case. but I was pretty frustrated with a similar problem for some time.
@artsmc88 I never said it needs to sit in node_modules. Please read my previous posts closely - app.import does not work for ES6 modules. My original post noted that placing the module inside the app folder works fine.
well I guess the simple answer to the question is no. you can use the other options or make a emberaddon. I dunno i think that placing it inside the app folder makes more sense for organization, so i was wondering if you had a use case?
The use case is: use an existing, 3rd-party ES6 module in an Ember app, without needing to manually move it into the app directory.
@chrisbateman I am facing a similar issue. I need to import an es6 file fro the vendor folder - did you ever get this working?
Same here; I would expect that I can create an ES6 module, put it into the bower_components directory and then have it transpiled automatically into the app somehow. This is something that should be really simple and has proven very frustrating. Simply put: if I have my own ES6 module, how to I use it in my ember app?
@jackmatt2 Unfortunately not. We’ve elected to stay away from Ember for now, largely due to the inflexibility of the build process with issues like this.
I did, however, hear from @wycats that support would be coming soon: https://twitter.com/wycats/status/617038351917420544
node_modules
Any reason why you are asking if the module needs to sit in the node_modules ? I mean can we not use app.import for node_modules like we do for bower_components ? If no, what is the correct way to use Node packages (or 3rd party libraries)?
I was directly in the Index.html to introduce the third party Library
Does anyone know if there has been any progress related to this? I am learning Ember and attempting to use it in my electron-based application but getting extremely mixed up between the various module systems, ES2015 import/export via Babel with Ember, require made available via electron, require made available via node, … Any help or advice would be appreciated.
I’m still using the process described here to import some es6 modules in vendor/, not sure if it still applies to es6 modules in node_modules/.
guess importing ES6 modules from vendor doesn’t work still. moved them to app
lots of misleading info on this out there, though, e.g. https://github.com/ember-cli/ember-cli/issues/1352