ecl
ember-cli-lazy-load
npm i ember-cli-lazy-load
ecl

ember-cli-lazy-load

Support lazily loading your Ember app via splitting it up into Bundles

by Pepijn Schoen

0.3.0 (see all)License:MITTypeScript:Not Found
npm i ember-cli-lazy-load
Readme

Ember-cli-lazy-load

Ember Cli Lazy Load supports lazily loading your Ember application, by splitting the app up into bundles. It comes with a dummy app that implements a basic lazy loading scenario.

Requirements: ember-cli >= 2.3.0 For ember-cli == 2.2.0, use release 0.2.2.

Whenever ember-engines land their version of lazy loading, this add-on will be deprecated.

Installation

  • ember install ember-cli-lazy-load

Getting started

1. Configure your bundles in config/bundles.js


index: {
  //Minisearch file patterns for the content of the bundle
  files: [
    "**/templates/index.js",
    "**/controllers/index.js",
    "**/components/my-cat/**.js"
  ],

  //The name of the routes if you are using the lazy-route mixin, no minisearch expressions are allowed here.
  routes: ["index", "..."]
  //The dependencies for this bundle. They will loaded in the same batch as the actual bundle
  dependencies: ["about"],
},
about: {
  files: [
    "**/templates/about.js",
    "**/controllers/about.js",
    "**/components/my-item/**.js"
  ],
  routes: ["about", "more routes for this bundle "]
}

2. Modify config/environment.js to include the bundle files

var bundles = require("./bundles");
module.exports = function(environment) {
  var ENV = {
    bundles: bundles(environment),

3. Modify your ember-cli-build.js to use the custom bundle build flow.

var EmberApp = require("ember-cli-lazy-load/ember-app");
var bundles = require("./config/bundles")();

module.exports = function(defaults) {
  var app = new EmberApp(defaults, {
    // Add options here
    bundles: bundles
  }

4. Add Mixin to your routes


import Ember from "ember";
import LazyRouteMixin from 'ember-cli-lazy-load/mixins/lazy-route';

export default Ember.Route.extend(LazyRouteMixin, {});

if you already override beforeModel, ensure that you execute and await the super call:

import Ember from "ember";
import LazyRouteMixin from 'ember-cli-lazy-load/mixins/lazy-route';

export default Ember.Route.extend(LazyRouteMixin,{
  beforeModel: function(transition, queryParams){
      return this._super(transition,queryParams).then(()=>{
        // do the other beforeModel operations
      });
    }
});

Running

  • ember server
  • Visit your app at http://localhost:4200.

Running Tests

  • npm test (Runs ember try:testall to test your addon against multiple Ember versions)
  • ember test
  • ember test --server

Downloads/wk

4

GitHub Stars

42

LAST COMMIT

2yrs ago

MAINTAINERS

2

CONTRIBUTORS

5

OPEN ISSUES

9

OPEN PRs

0
VersionTagPublished
0.3.0
latest
6yrs ago
No alternatives found
No tutorials found
Add a tutorial

Rate & Review

100
No reviews found
Be the first to rate