anguheadercomponentlib v1.0.4

A Simple Header Angular Component Library

This project can serve as a primer for creating an angular ui component libraries which can be used across multiple angular web applications.

Description

This is a simple library module written in typescript that exposes a header component ( app-header ). It can be consumed just like any other npm modules ( npm i anguheadercomponentlib ), and once installed it can be consumed in the typescript code or javascript code as a module.

NPM Repository

https://www.npmjs.com/package/anguheadercomponentlib

Compatibility

Currently this library component is compatible to run across web application running on angular versions greater than or equal to 2.0.0 Hence the dependencies mentioned in the package.json is of the format

"@angular/core": ">=2.0.0"

Quick Start

#Create an angular app in your system
ng new app-name

# Install the node module
npm install anguheadercomponentlib

# Go to root app module under the project directory and import the headermodule from anguheadercomponentlib
import { HeaderModule } from 'anguheadercomponentlib';

# Consume it in your html file
<app-header>Such Header</app-header>

Technology stack and main features

• This project uses ng-packagr for module bundling capabilities. This generates modules in formats like UMD, ES6 as well ES5 which ensures browser compatibility with the older browsers.

You can use this project to

• create library for Angular 4.
• be ready for further AOT or JIT compilation.
• be ready for further usage directly in browsers (let's say UMD bundle loaded by SystemJS).

Pros

• We can leverage all the module bundling capabilities which using ng-packagr.

  Read why we need module bundles and how they work Javascript module bundlers

Cons

• ng-packagr uses rollup as a module bundler and hence we are bit confined in our choice of module bundlers . However roll up provides additional capabilities like tree-shaking

Further References :

Read more about architectural challenges and solutions used in this repository. AOT Compatibility