toddmotto / angularjs-styleguide

AngularJS styleguide for teams
https://ultimateangular.com
5.96k stars 700 forks source link

webpack with ng-annotate needs 'ngInject' for routing config #116

Closed alecklandgraf closed 8 years ago

alecklandgraf commented 8 years ago

In your low level component description webpack somehow mangles the ui-router config without adding 'ngInject' at the top of the function. The angular error is angular.js:68 Uncaught Error: [$injector:modulerr] Failed to instantiate module app due to: and the stack trace only points to angular internals.

Of note, I'm bootstrapping the following way:

angular.element(document).ready(function() {
  angular.bootstrap(document.querySelector('[data-main-app]'), [
    appModule.name
  ], {
    strictDi: true
  });
});
import angular from 'angular';
import uiRouter from 'angular-ui-router';
import CalendarComponent from './calendar.component';

const calendar = angular
  .module('calendar', [
    uiRouter
  ])
  .component('calendar', CalendarComponent)
  .config(($stateProvider, $urlRouterProvider) => {
   'ngInject';                          // <--- Add 'ngInject' here !!!!
    $stateProvider
      .state('calendar', {
        url: '/calendar',
        component: 'calendar'
      });
    $urlRouterProvider.otherwise('/');
  })
  .name;

export default calendar;
toddmotto commented 8 years ago

I'm not assuming webpack for the build process here, but thanks for pointing it out to others :)