Ember CLI Addon for using AMD libraries
JavaScript HTML
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.

README.md

Ember-cli-amd

The Ember loader is conflicting with the AMD loader. The Ember loader is not async and doesn't comply with the RequireJS or AMD specs.

This addon will:

  • Update the code generated by Ember to avoid conflicts with the AMD loader
  • Update the index.html:
    • load any pure AMD modules found in the code first using the AMD loader
    • load the Ember code as AMD modules (app and vendor)
    • reference the AMD modules inside the Ember loader

View it live using the ArcGIS API for JavaScript.

Features

Installation

  • git clone this repository
  • npm install

Usage

Install to your ember-cli application

  • ember install ember-cli-amd

Provide a list of packages that will be loaded via an AMD loader such as RequireJS or Dojo. You can also provide the source for the loader.

// use this in ember-cli-build.js
// Sample if using the ArcGIS API for JavaScript
var app = new EmberApp({
  amd : {
    // Specify the type of AMD loader. Either a CDN path or a local loader ('dojo' or 'requirejs')
    loader: 'https://js.arcgis.com/3.15/',
    // user defined AMD packages to search for in application
    packages: [
      'esri','dojo','dojox','dijit',
      'put-selector','xstyle','dgrid'
    ],
    // Required the AMD configuration file path relative to the project root.
    // The file will be copied to the output directory (./dist) and the configuration file
    // will be loaded before the loader is loaded. The configuration file must define the global variable used by the specific loader.
    // For dojo, the supported global variable name are `dojoConfig`, `djConfig` or `require`.
    // For requirejs, the global variable is called `require`.
    // Please refer to the documentation for the correct use of the configuration object.
    configPath: 'config/dojo-config.js',
    // If using a local loader ('dojo' or 'rquirejs'), the path to the AMD library must be provided.
    libraryPath: 'bower_components/amdlibrary',
    // When using a local loader, we will build the AMD module using requirejs into a single file
    // The following properties allow to control the build
    // Optional: it defaults to assets/built.js
    buildOutput: 'assets/built.js'
    // Optional: Will use RequireJS i18n to set the localization, default is 'en-us'
    locale: 'en-us',
    // Optional: Will create a dependencies.txt that will list all the AMD dependencies in the application, default is false
    outputDependencyList: true,
    // Optional, defaults to true. If `true` the amd-start and amd-config scripts will be inlined into index.html.
    // This saves xhrs during application boot, so unless you are generating your index.html file on the fly (i.e. from node or rails)
    // you should likely enable this.
    inline: true,
    // RequireJS build configuration options
    // Please refer to RequireJS docs for more information
    // http://requirejs.org/docs/optimization.html
    buildConfig: {
      include: [
        'foo/bar/baz'
      ],
      exclude: [
        'lorem/ipsum'
      ],
      paths: {
        'plugins/plugin': 'empty:'
      }
    }
  }
});

If using ember-cli-content-security-policy, update this ENV object in config/environment.js to allow pulling in CDN resources such as with the ArcGIS API for JavaScript.

var ENV = {
  ...
  contentSecurityPolicy: {
    'default-src': "'none'",
    'script-src': "'self' 'unsafe-eval' 'unsafe-inline' http://js.arcgis.com/ https://js.arcgis.com/",
    'font-src': "'self'",
    'connect-src': "'self' http://services.arcgis.com/ http://services.arcgisonline.com/",
    'img-src': "'self' http://js.arcgis.com/",
    'style-src': "'self' 'unsafe-inline'",
    'media-src': "'self'"
  }

Example using the CDN resources

// ember-cli-build.js
module.exports = function(defaults) {

  var app = new EmberApp(defaults, {
    amd :{
      loader: 'https://js.arcgis.com/3.15/',
      configPath: 'config/dojo-config.js',
      packages: [
        'esri','dojo','dojox','dijit',
        'put-selector','xstyle','dbind','dgrid'
      ]
    }
  });

  return app.toTree();
};
// config/dojo-config.js if using dojo
var dojoConfig = {
  async: true
};

Using a CDN for your application's assets

When using ember-cli-deploy it is common to deploy the assets of an ember application to a different location (cdn) from the index.html. The ember-cli-deploy documentation discusess how to use fingerprinting to prepend fully-qualified urls to the asset locations. As of v0.4.1 of ember-cli-amd these same options are applied to the AMD related scripts that are injected into the page, thus allowing this to work smoothly with ember-cli-deploy.

Running

Running Tests

  • ember test
  • ember test --server

Building

  • ember build

Requirements

  • Up to version 0.4.9 Ember CLI 1.13.0 or greater.
  • Starting at version 1.0.0 Ember CLI 2.18.0 or greater.

Resources

Issues

Find a bug or want to request a new feature? Please let us know by submitting an issue.

Contributing

Esri welcomes contributions from anyone and everyone. Please see our guidelines for contributing.

Licensing

Copyright 2018 Esri

Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at

http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.

A copy of the license is available in the repository's LICENSE file