ES6/TypeScript import and Angular

Question

There's something I'm not sure to understand with ES6 module import and Angular (although it's not restrcited to Angular)

When I'm importing a component like this :

import { Component } from '@angular/core';

Ok I'm importing the Component class from @angular/core package.

But if I go to node_modules : there's no Component class file at the root of @angular/core. I can see some bundle, esm5, esm2015 and src packages and also files like core.d.ts at the root. How the module loader manages to understand where this Component is located ?

Thanks

If you don't specify a file name to import, index.ts/js will be used (@angular/core/index.ts). You can go from this file up the tree (there are many files that only export in between) — baao
– baao, Commented Jun 7, 2018 at 16:51

Will Huang · Accepted Answer · 2018-06-07 18:19:42Z

1

When you importing @angular/core module, it will look for package.json in the module root that is node_modules/@angular/core folder. And then look for main property which is the main entry point of the module. This is the file you want.

answered Jun 7, 2018 at 18:19

Will Huang

3,7164 gold badges44 silver badges124 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

AntonBoarf Over a year ago

Ok than you. I can see that in package.json there's a main attribute (core.umd.js) and also a module attributre (core.js). Are they the same thing ?

Will Huang Over a year ago

@AntonBoarf There are different module coding pattern. So their source code are different in module system only.

Collectives™ on Stack Overflow

ES6/TypeScript import and Angular

1 Answer 1

2 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Related