Angular: Creating Angular Client Library

urstrulyvishwak

Kurapati Mahesh

Posted on November 18, 2022

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

💖 💪 🙅 🚩
urstrulyvishwak
Kurapati Mahesh

Posted on November 18, 2022

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related