Sharing Top Content from the Angular-sphere.

🎊 Create Angular Libraries in No Time Using Schematics 🎉

  • 🎊 Create Angular Libraries in No Time Using Schematics 🎉 – Maybe it’s just me, but since Angular was released, creating an open source library has been no simple task.
  • Luckily with the release of Angular Schematics, tools have been created to simplify the process by integrating an environment that is convenient and familiar to us — Angular cli.
  • To simplify the process, we will use a library I have encountered recently — Angular Library Schematics.
  • The real advantage of this tool over something like ng-packagr is that it exposes the build tools written in gulp, giving you full control over the build process.
  • Building and PublishingTo publish our library, we just need to run: – npm run build:lib – cd dist npm publishThat’s it.

Maybe it’s just me, but since Angular was released, creating an open source library has been no simple task. Luckily with the release of Angular Schematics, tools have been created to simplify the…

🎊 Create Angular Libraries in No Time Using Schematics 🎉

Maybe it’s just me, but since Angular was released, creating an open source library has been no simple task.

Luckily with the release of Angular Schematics, tools have been created to simplify the process by integrating an environment that is convenient and familiar to us — Angular cli.

In this article, I will guide you step by step as we create and publish an Angular library.

To simplify the process, we will use a library I have encountered recently — Angular Library Schematics. (By Carlos Roso)

For our demo, we’ll create a directive that will call for us to stopPropagation() when we need to. For example:

button (click.stop)=”onClick($event, extraData)”Click Me/buttonInstallationFirst, we need to install some dependencies.

npm i -g

ng-lib-schematics

@angular-devkit/core let’s create a new angular-cli project with the following command.

ng new library-name –skip-installNext, we can create our library.

schematics –name library-nameAfter running the above command, you will find a new folder labelled lib inside the src folder. It will include sample demo module and the build tools.

From here, you can start developing the library like you are used to.

The real advantage of this tool over something like ng-packagr is that it exposes the build tools written in gulp, giving you full control over the build process.

For…

🎊 Create Angular Libraries in No Time Using Schematics 🎉