Angular: Creating Angular Client Library

Download and install Node.js

⬇

Open Terminal or Command Prompt and check node version using command node -v

⬇

Now, type in npm install -g @angular/cli to install CLI

⬇

Check CLI version using ng --version

⬇

Create Angular workspace using ng new <app_name>

⬇

app_name consider as libraryApp

⬇

To create library init, use ng g library <library_name>

⬇

library_name consider as myLib

⬇

Inside the projects folder, go to mylib component inside myLib library.

⬇

Design reusable component in it.

⬇

Now, build that library using ng build <library_name>

⬇

Library gets generated in dist folder

Using this library in same application.

Import myLib module in app.module.ts of application

⬇

Access components or services of myLib library inside application and use wherever required in application

⬇

Now, do ng serve to check the application

Using in external application

ng new externalApp - Create new external application

⬇

In the ng build myLib log, dist folder locations are shown

⬇

take lib path and do npm i <path> inside new external application

⬇

Import myLib module in app.module.ts of application

⬇

Access components or services of myLib library inside application and use wherever required in application

⬇

Now, do ng serve to check the application