Peeking behind ember-cli (EmberApp): vendor.js and app.js

1.1k views Asked by At

With the excellent broccoli-stew I can take a look at the exported application tree:

/* global require, module */

var EmberApp = require('ember-cli/lib/broccoli/ember-app');

var log   = require('broccoli-stew').log;
var debug = require('broccoli-stew').debug;

var app = new EmberApp();

// Use `app.import` to add additional libraries to the generated
// output files.
//
// If you need to use different assets in different
// environments, specify an object as the first parameter. That
// object's keys should be the environment name and the values
// should be the asset to use in that environment.
//
// If the library that you are including contains AMD or ES6
// modules that you would like to import into your application
// please specify an object with the list of modules as keys
// along with the exports of each module as its value.

app.import('bower_components/ember-i18n/lib/i18n.js');
app.import('bower_components/raphael/raphael.js');

var finalTree = log(app.toTree());

module.exports = finalTree;

With this I get a very clean tree-like output of my application:

[ 'assets/app.js',
  'assets/app.map',
  'assets/app.scss',
  ...
  'assets/vendor.css',
  'assets/vendor.js',
  'assets/vendor.map',
  'crossdomain.xml',
  'index.html',
  'robots.txt',
  'testem.js',
  'tests/index.html' ]

I see that in that tree we have, among other files, a vendor.js and an app.js modules (as expected), but I do not know what packages are put into each of them.

I have the feelling I am missing one in my frontend (in this case, raphael.js), so I would like to verify that ember-cli (via EmberApp) has indeed done what I asked for (namely, include the raphael.js, probably in vendor.js)

Taking a direct look at app.js or vendor.js is not feasible (too big / don't know what to look for). I want a simple tree-like display of the files that have been included by EmberApp into vendor.js / app.js, in the same (similar) format that broccoli-stew is providing.

Is this possible? How?

1

There are 1 answers

3
Phil Rykoff On

To quote http://www.ember-cli.com/asset-compilation/#configuring-output-paths:

Assets                                          Output File
JavaScript files you import with app.import()   /assets/vendor.js

So although that is not a nice tree view, you should be fine :-)