Example library with Angular 5 + Angular CLI playground

Angular example library that can serve as base project if you want to build your own library
Report bug · Request feature

Deprecated This project is no longer maintained. If you want to create an angular library, check this.

Features
Quick start
Bugs and feature requests
Creators
Copyright and license

Features

Sample component, service, directive and pipe
Unit tests with Karma and Jasmine
Playground with Angular CLI to test the library in a 'real application'
Linting
Automatic versioning
Documentation

Quick start

Warning: we strongly recommend node >=v6.9.0 and npm >=3.0.0

npm i - Installs project modules

npm run install-all - Installs project modules and playground modules

npm run clean - Removes every generated folder

npm run build - Builds the library using gulp

npm run build:watch - Builds the library using gulp waiting for changes

npm run docs - Generates all the documentation

npm start - Runs the playground and the build process waiting for changes

npm run link - Links the library folder in order to use it in the playground with npm link

npm run playground - Runs the playground (maybe you have to use sudo or have permissions)

npm run test - Runs the tests with karma and jasmine

npm run test:watch - Runs the tests with karma and jasmine waiting for changes

npm run lint - Runs the linter

Modify this project and make your own angular library:

Just in three steps:

Rename every occurrence of 'angular-example-library' to 'your-library-name'.
Modify src folder according to your need.
npm run build

To release a new version of this library and publish it to npm, run:

$ npm run release

Remember to login in npm. The script (release.sh) will publish your dist folder.

Once you have published your library to npm, you can import your library in any Angular application by running:

$ npm install your-library-name

and then from your Angular AppModule:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';

// Import your library
import { YourLibraryModule } from 'your-library-name';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,

    // Specify your library as an import
    YourLibraryModule.forRoot()
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule {
}

Once your library is imported, you can use its components, directives and pipes in your Angular application.

Bugs and feature requests

Have a bug or a feature request? Please first read the issue guidelines and search for existing and closed issues. If your problem or idea is not addressed yet, please open a new issue.

Creators

Ismael Ramos

https://github.com/ismaestro

Copyright and license

Enjoy 🤘