Hi there, I am quite new to developing in Ember. In a legacy project I am working with, a lot of dependencies are imported into the application via a app.import line in the ember-cli-build.js file, as in:
app.import('node_modules/moment/moment.js');
I wonder if there is any reason to do this instead of simply
import moment from "moment.js"
in the JS file where you need it (which is the most usual practice for frontend projects).
Thanks for any hint!
Hi @Alberto_Diaz_Dorado, welcome!
For context, a very brief overview of how this all evolved is as follows:
- The Ember build system was developed before any standards around javascript modules and the modern bundlers we know and love came to be, thus the
app.import syntax was the standard way of importing other packages into an Ember app
- Later ember-auto-import was developed which allows zero-config NPM imports, but still dependent on having ember-auto-import to find and “coerce” the imported packages into the classic Ember build system
- The Ember build system, probably the last major legacy holdover in the Ember framework, has been overhauled with what we call Embroider, which essentially “pre-compiles” Ember down to common JS modules so we can freely adopt all the great build tools that are enjoyed by the greater JS ecosystem
So… in order of least to most work:
- since you mentioned this is a legacy app the easiest thing to do is probably to stick with
app.import
- If you have ember-auto-import installed or you are able to add it (depends on how old the app is, etc) you should be able to use the latter import syntax that you described above
- And of course if you were able to upgrade all of the dependent packages and get to a modern Ember version you could use Embroider to build the app and you could use the nicer standard import syntax without any config or extra packages