ocLazyLoad icon indicating copy to clipboard operation
ocLazyLoad copied to clipboard

No module found during bootstrap.

Open zeeshanjan82 opened this issue 8 years ago • 1 comments

I am trying to convert an js angular1 project into typescript : https://github.com/swimlane/angular1-systemjs-seed While doing this I am facing following issue. I have converted the entire project to use typescript instead of ES6 but when I run the app in browser, I face the following issue: error

zeeshanjan82 avatar Nov 09 '16 03:11 zeeshanjan82

I have narrowed down the issue and now with only this simple app I am getting the same issue: My app.ts source code is:

import 'babel/external-helpers';
import * as angular from 'angular';
import 'angular-ui-router';
import 'ocLazyLoad';
import futureRoutes from '../app/routes.json!json';


let app  = angular.module('posClient', ['ui.router', 'oc.lazyLoad']);
app.config(['$urlRouterProvider', '$locationProvider', '$stateProvider', '$httpProvider', '$logProvider', '$ocLazyLoadProvider', '$futureStateProvider',
           function ($urlRouterProvider, $locationProvider, $stateProvider, $httpProvider, $logProvider, $ocLazyLoadProvider, $futureStateProvider) {
  console.log(futureRoutes);
  app.requires.push('ct.ui.router.extras.future');
  $ocLazyLoadProvider.config({
    debug: true
  });
  $futureStateProvider.stateFactory('load', ['$q', '$ocLazyLoad', 'futureState', function($q, $ocLazyLoad, futureState) {
    var def = $q.defer();
    System.import(futureState.src).then(loaded => {
      var newModule = loaded;
      if (!loaded.name) {
        var key = Object.keys(loaded);
        newModule = loaded[key[0]];
      }

      $ocLazyLoad.load(newModule).then(function() {
        def.resolve();
      }, function() {
        console.log('error loading: ' + loaded.name);
      });
    });

    return def.promise;
  }]);

  futureRoutes.forEach(function(r) {
    $futureStateProvider.futureState(r);
  });
}]);
angular.element(document).ready(function() {
  angular.bootstrap(document.getElementsByTagName("html")[0], [ app.name ], {});
});

export default app;

My routes.json file is:

[
  {
    "stateName": "login",
    "urlPrefix": "/login",
    "type": "load",
    "src": "app/login/login"
  }
]

My login.ts file is:

export default angular.module('login', []);

zeeshanjan82 avatar Nov 09 '16 06:11 zeeshanjan82