How to fix ng build <lib> error when renaming public_api.ts to public-api.ts in angular8 upgrade

I am in the middle of migrating angular 7 to angular 8 for my company's component library that was built with 'ng generate library '. I tried to be as close to standard angular cli build as possible. I created a brand new app and a library with "@angular/cli": "~8.2.0".

https://github.com/Annie-Huang/my-angular8-app/tree/create-lib

I noticed in angular 8, they change public_api.ts to public-api.ts https://github.com/Annie-Huang/my-angular8-app/blob/create-lib/projects/ea-ui/src/public-api.ts

So I renamed the entry file from the existing library from public_api.ts to public-api.ts And also update it in ng-package.json

And I get this error of

Bradleys-MacBook-Pro:ea-component-library anniehuang$ ng build ea-ui
Building Angular Package
ERROR: error TS6053: File '/Users/anniehuang/projects/ea-component-library/projects/ea-ui/src/public_api.ts' not found.

An unhandled exception occurred: error TS6053: File '/Users/anniehuang/projects/ea-component-library/projects/ea-ui/src/public_api.ts' not found.

See "/private/var/folders/sw/1rxh903n6y39kkwbgr737n8m0000gp/T/ng-SE3jbI/angular-errors.log" for further details.

When I built it in the brand new angular 8 app in my own repo (ng build ea-ui). I don't have this error.

And there is no public_api.ts string when I did global search on the company component library.

ng-package.json:
---------------------
{
  "$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
  "dest": "../../dist/ea-ui",
  "lib": {
    "entryFile": "src/public-api.ts"
  }
}

public-api.ts (file content not change, just renamed):
----------------------------------------------------------
export * from './lib/accordion/accordion.component';
export * from './lib/accordion/accordion.module';
export * from './lib/autocomplete/autocomplete-trigger.directive';
export * from './lib/autocomplete/autocomplete.component';
export * from './lib/autocomplete/autocomplete.module';
....

Bradleys-MacBook-Pro:ea-component-library anniehuang$ ng build ea-ui
Building Angular Package
ERROR: error TS6053: File '/Users/anniehuang/projects/ea-component-library/projects/ea-ui/src/public_api.ts' not found.

An unhandled exception occurred: error TS6053: File '/Users/anniehuang/projects/ea-component-library/projects/ea-ui/src/public_api.ts' not found.

See "/private/var/folders/sw/1rxh903n6y39kkwbgr737n8m0000gp/T/ng-SE3jbI/angular-errors.log" for further details.

Open up angular-errors.log:
------------------------------
Bradleys-MacBook-Pro:~ anniehuang$ cat /private/var/folders/sw/1rxh903n6y39kkwbgr737n8m0000gp/T/ng-MET38P/angular-errors.log
[error] Error: error TS6053: File '/Users/anniehuang/projects/ea-component-library/projects/ea-ui/src/public_api.ts' not found.

    at analyseEntryPoint (/Users/anniehuang/projects/ea-component-library/node_modules/ng-packagr/lib/ng-v5/init/analyse-sources.transform.js:45:15)
    at MapSubscriber.exports.analyseSourcesTransform.rxjs_1.pipe.operators_1.map.graph [as project] (/Users/anniehuang/projects/ea-component-library/node_modules/ng-packagr/lib/ng-v5/init/analyse-sources.transform.js:15:9)
    at MapSubscriber._next (/Users/anniehuang/projects/ea-component-library/node_modules/rxjs/internal/operators/map.js:49:35)
    at MapSubscriber.Subscriber.next (/Users/anniehuang/projects/ea-component-library/node_modules/rxjs/internal/Subscriber.js:66:18)
    at SwitchMapSubscriber.notifyNext (/Users/anniehuang/projects/ea-component-library/node_modules/rxjs/internal/operators/switchMap.js:86:26)
    at InnerSubscriber._next (/Users/anniehuang/projects/ea-component-library/node_modules/rxjs/internal/InnerSubscriber.js:28:21)
    at InnerSubscriber.Subscriber.next (/Users/anniehuang/projects/ea-component-library/node_modules/rxjs/internal/Subscriber.js:66:18)
    at MapSubscriber._next (/Users/anniehuang/projects/ea-component-library/node_modules/rxjs/internal/operators/map.js:55:26)
    at MapSubscriber.Subscriber.next (/Users/anniehuang/projects/ea-component-library/node_modules/rxjs/internal/Subscriber.js:66:18)

Actually found out the reason. Turned out if your library's package.json got ngPackage section, it will take the information there rather than the one in ng-package.json. And if that ngPackage section doesn't have a entryfile, it will take src/public_api.ts by default:

So in the FAILED situation, my file content are: In /projects/ea-ui/package.json:

{
  "name": "@ea/ea-ui",
  "version": "1.13.5",
  "peerDependencies": {
    "@angular/common": "^8.2.0",
    "@angular/core": "^8.2.0"
  },
  "dependencies": {
    "dayjs": "^1.8.15",
    "ngx-take-until-destroy": "^5.4.0",
    "ngx-mask": "^8.0.2",
    "@angular/cdk": "^8.1.2"
  },
  "ngPackage": {
    "dest": "../../dist/ea-ui",
    "whitelistedNonPeerDependencies": [
      "dayjs",
      "ngx-take-until-destroy",
      "ngx-mask",
      "@angular/cdk"
    ],
    "lib": {
      "styleIncludePaths": [
        "./src/assets/scss"
      ]
    }
  }
}

In /projects/ea-ui/ng-package.json:

{
  "$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
  "dest": "../../dist/ea-ui",
  "lib": {
    "entryFile": "src/public-api.ts"
  }
}

Now I change it to the following the it PASSED: In /projects/ea-ui/package.json:

{
  "name": "@ea/ea-ui",
  "version": "1.13.5",
  "peerDependencies": {
    "@angular/common": "^8.2.0",
    "@angular/core": "^8.2.0"
  },
  "dependencies": {
    "dayjs": "^1.8.15",
    "ngx-take-until-destroy": "^5.4.0",
    "ngx-mask": "^8.0.2",
    "@angular/cdk": "^8.1.2"
  }
}

In /projects/ea-ui/ng-package.json:

{
  "$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
  "dest": "../../dist/ea-ui",
  "lib": {
    "styleIncludePaths": [
      "./src/assets/scss"
    ],
    "entryFile": "src/public-api.ts"
  },
  "whitelistedNonPeerDependencies": [
    "dayjs",
    "ngx-take-until-destroy",
    "ngx-mask",
    "@angular/cdk"
  ]
}

Recommended topics

Hot tags