Incorporating oc lazyload with gulp-angular

Question

How can I incorporate oc lazyload to work with gulp-angular yeoman generator , Since running gulp will inject all the dependencies in the scripts folder. How can I configure oc lazyload to inject the dependencies instead ?

Answer 1

There are multiple things you need to do

• Remove references of dependencies from index.html

• Add dependencies for each project along with route using either

  <div oc-lazy-load="['scripts/controllers/about.js', 'scripts/services/helloservice.js']">
      <div ng-controller="AboutCtrl as about">
           Your html goes here
      </div>
  </div>
  

• Or you can add references in app.js file

  $ocLazyLoadProvider.config({
  modules: [{
        name: 'helloWorldApp.contact',
        files: ['scripts/controllers/contact.js', 
                'scripts/services/contactservice.js']
        }]
  });
  

I have implemented the same with Grunt instead of Gulp. But it's alomst same. Checkout my article. https://routerabbit.com/blog/convert-angularjs-yeoman-spa-lazyload/