3

I'm trying to implement multiple entry points in to my angular library(similar to material library) & getting multiple errors.

Environment

Angular  - 10.2.x
TypeScript - 3.9.x
ng-packagr - 10.1.x

Library structure is as below

@MyLib
├── src
    |-----Button
          ├──── ng-package.json
          ├──── public_api.ts
          |──── *.ts

    |-----Card
          ├──── ng-package.json
          ├──── public_api.ts
          |──── *.ts

    |-----Icon
          ├──── ng-package.json
          ├──── public_api.ts
          |──── *.ts

├── ng-package.json
|── package.json

When tried to implement multiple entry points without any dependency of one component into another - I could able to succeed & use it in other projects.

But when tried using one module in to another (for example, if i want to use Button & Icon in Card component), I get the below error.

export * from "./icon.module";
                ~~~~~~~~~~~~~~~
/overall-project/projects/my-lib/icon/public-api.ts:6:15 - error TS6059: File '/overall-project/projects/my-lib/lib/core/utils.ts' is not under 'rootDir' '/overall-project/projects/my-lib/card/src'.

'rootDir' is expected to contain all source files.

But this is what exactly Angular Material does it here - https://github.com/angular/components/blob/master/src/material/button/button.ts#L23

In angular/material, button component imports methods from other module(core module) & also implements multiple entry points.

Wonder why doesn't it work for me, any ideas???

PS: Haven't defined 'rootDir' anywhere in the tsconfig.json

  • I worked on similar projects in the last year, and the Nrwl Nx tools were a GREAT help to setup and manage a project with (a lot) of libraries. Would recommend to use that for your workspace. If you want to setup by yourself, you could add a tsconfig to each module, and in your root tsconfig add aliases (like ng material `@yourlib/module-xyz`) But Nx does all this stuff for you, so... :) – Marian Theisen Apr 06 '21 at 05:22

0 Answers0