Mik378 Mik378 - 4 months ago 53
AngularJS Question

Handling files order regarding concatenation with WebPack?

A good practice when using Angular is to separate module definition from each usage of this module (one usage per file).

For instance:

//HomeModule.js
angular.module('home', []);

//HomeService.js
angular.module('home')
.service('HomeService', HomeService);


Classic issue is regarding files concatenation:

If
HomeService.js
is injected before
HomeModule.js
in the final file, this would result in this error:

Uncaught Error: [$injector:modulerr]


Using gulp, there's a handy gulp-angular-sort that could manage it for us.

How to handle Angular files ordering when dealing with WebPack and files concatenation, to prevent this kind of disorder?

Answer

I disagree, this line .service('HomeService', HomeService); belongs to module, not service. So you have following setup:

HomeService.service.js:

export default ['$timeout', ..., ($timeout, ...) => { /*some code*/}]

HomeModule.js:

import HomeService from 'HomeService.service.js'

angular.module('home', [])
 .service('HomeService', HomeService);

You do not have any problems with order in this case.

Comments