Angular - What is the meanings of module.id in component?

Nishchit Dhanani picture Nishchit Dhanani · May 12, 2016 · Viewed 72.1k times · Source

In an Angular app, I have seen that @Component has property moduleId. What does it mean?

And when module.id is not defined anywhere, the app still works. How can it still work?

@Component({
  moduleId: module.id,
  selector: 'ng-app',
  templateUrl: 'app.component.html',
  styleUrls: ['app.component.css'],
  directives: [AppComponent]
});

Answer

Nishchit Dhanani picture Nishchit Dhanani · May 12, 2016

The beta release of Angular (since vesion 2-alpha.51) supports relative assets for components, like templateUrl and styleUrls in the @Component decorator.

module.id works when using CommonJS. You don't need to worry about how it works.

Remember: setting moduleId: module.id in the @Component decorator is the key here. If you don't have that then Angular 2 will be looking for your files at the root level.

Source from Justin Schwartzenberger's post, thanks to @Pradeep Jain

Update on 16 Sep 2016:

If you are using webpack for bundling then you don't need module.id in decorator. Webpack plugins auto handle (add it) module.id in final bundle