Search code examples
angularangular-cliangular-libraryng-packagr

angular-cli library create secondary entry point


I am trying to create what I believe is called a secondary entry point into my angular npm package. I want the following two entry points

@scope/data-service
@scope/data-service/models

Using the angular-cli to generate the base package generates the following structure

scope
└───data-service
    │   karma.conf.js
    │   ng-package.json
    │   ng-package.prod.json
    │   package.json
    │   tsconfig.lib.json
    │   tsconfig.spec.json
    │   tslint.json
    │
    └───src
        │   public_api.ts
        │   test.ts
        │
        └───lib
                data-service.component.spec.ts
                data-service.component.ts
                data-service.module.ts
                data-service.service.spec.ts
                data-service.service.ts

Based on ng-packagr documentation you would add a folder under data-service called models then add a second package.json to that folder but ng-packagr seems to use a slightly different structure than the angular-cli. Ideally I am trying to model the structure similar to https://github.com/angular/angular/tree/master/packages/common but as long as the public exposed is @scope/data-service and @scope/data-service/models I would be happy.

When I try to create the structure similar to ng-packager recommendation I get

error TS6059: File 'C:/projects/data-service-app/projects/scope/data-service/models/src/index.ts' is not under 'rootDir' 'C:\projects\data-service-app\projects\scope\data-service\src'. 'rootDir' is expected to contain all source files.

When I move the models directory into the data-service\src directory my entrypoints are

@scope/data-service
@scope/data-service/src/models

How do I get rid of the src on my secondary entry point?

What is the correct approach for creating a library with a secondary entry point when using the angular-cli?


Solution

  • Thanks for the reply. Here is the solution I ended up with, it all revolved around setting up the index.ts and public_api.ts files correctly

    \---projects
        \---scope
            \---ngx-package
                |   karma.conf.js
                |   ng-package.json
                |   ng-package.prod.json
                |   package.json
                |   tsconfig.lib.json
                |   tsconfig.spec.json
                |   tslint.json
                |
                \---src
                    |   public_api.ts
                    |   test.ts
                    |
                    +---lib
                    |       package-client-config.ts
                    |       package-client.spec.ts
                    |       package-client.ts
                    |       package.module.ts
                    |
                    \---models
                        |   index.ts  (1)
                        |   package.json (2)
                        |   public_api.ts  (3)
                        |
                        \---src
                            |   public_api.ts  (4)
                            |
                            \---lib
                                |   model-a.ts
                                |   model-b.ts
                                |
                                \---hateoas
                                        hateoas.ts
    

    Ok so in the tree above notes the parens with numbers inside they correspond to the files below.

    1) /projects/scope/ngx-package/src/models/index.ts

    // export what ./public_api exports so we can reference models like
    // import { modelA } from './models'
    export * from './public_api';
    

    2) /projects/scope/ngx-package/src/models/package.json

    {
      "ngPackage": {}
    }
    

    3) /projects/scope/ngx-package/src/models/public_api.ts

    export * from './src/public_api';
    

    4) /projects/scope/ngx-package/src/models/src/public_api.ts

    export * from './lib/model-a';
    export * from './lib/model-b';
    export * from './lib/hateoas/hateoas';
    

    With this setup you only need to maintain your list of exports in one place. I tried a lot of other variations that didn't work this seemed to work without problem.