Fields Cage
Fields Cage

Reputation: 301

Ember CLI import ES6 file to ember-cli-builds.js

So the ember-cli-builds.js file clearly states

// 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.

I'm importing regular javascript files this way

app.import('vendor/global.js');

but what is the proper way to "specify an object with the list of modules as keys along with the exports of each module as it's value"?

Upvotes: 2

Views: 759

Answers (2)

NullVoxPopuli
NullVoxPopuli

Reputation: 65183

The selector answer is for older ember, pre ember-auto-import (webpack), and pre Ember Octane.

In modern ember, after npm installing a package, you'll be able to import directly from that package.

Example:

npm install qs

then anywhere in your app

import qs from 'qs';

related, it is recommended to avoid placing files in the vendor folder that you want to integrate with the module system. the vendor exists outside of the bundle, so if you have a standalone module, you can place it in your app folder, maybe under some descriptive folder: app/external-modules/global.js, allowing you to import from it like:

import * as globalStuff from '<my-app>/external-modules/global';

Upvotes: 0

ykaragol
ykaragol

Reputation: 6221

At the "AMD Javascript modules" heading of the guides, it is described like that:

Provide the asset path as the first argument, and the list of modules and exports as the second.

app.import('bower_components/ic-ajax/dist/named-amd/main.js', {
  exports: {
    'ic-ajax': [
      'default',
      'defineFixture',
      'lookupFixture',
      'raw',
      'request'
    ]
  }
});

You can now import them in your app. (e.g. import { raw as icAjaxRaw } from 'ic-ajax';)

Reference From Guide

Upvotes: 3

Related Questions