Angular CLI provides a command-line interface to do a lot of things like linting, changing configuration of your application, view docs, run and build your app etc etc..

Out of these commands, there is a generate command which allows us to create building blocks of our application. In this article, we are going to learn how to generate library and watch for changes in the library in an angular application.

Let's get started.

Create an empty angular application

ng new my-lib-app –createApplication false

This command will create angular application with an empty workspace.

Add a library project

Go to the root of this project and generate a library.

cd my-lib-app
ng g library lib1

This command will generate a library project for you. Now build this library:-

ng build lib1

Depending on angular.json configuration, it will generate build files in the output path. By default it should be dist/lib1.

Link this library in your local system. Go to the build folder of your library and run command:

npm link

It will globally link your library in your local system and you will be able to install it in any app in your system.

Create an angular application

Run following command to create an angular app:

ng g application myapp

Now install library which we've created earlier. But to enable watching, we’ll have to install this library with a file system url:

npm install file:./dist/lib1

Now run following commands:-

ng build lib1 --watch
ng serve

Now use any component from your library in the app. Run it. Make some changes to the library and you’ll see that app is updating automatically based on those changes.

You can find complete source code of this article here:-