Angular 5 library and consuming application shell project

We are upgrading our AngularJs application to Angular 5 with a good level of success. But our modularisation isn't as good as it once was in AngularJS.

For this job we are looking for 2 simple shell projects to be produced using Angular 5, to aid us in understanding how we can best achieve a similar stack as to what we had previously

1) Angular 5 Library project

Requirements

- Contains a simple module

- Contains a component and service

- Contain a UI Router that loads the component above

- Should be compile-able with either webpack or Angular CLI

- Should work with Angular CLI for component generation

- AOT compilation

- Produces a simple library .js file that can be published to NPM or other

2) Angular 5 application

Requirements

- Contains a simple app module

- Contains 2 simple components and UI Router views for these

- Contains 1 lazy loaded state that loads the library view created earlier from either the node_modules folder or elsewhere

- Should be packaged with webpack, try to keep the file clean - free of unnecessary plugins etc

The application should be able to lazy load the pre-compiled library .js file as is, (i.e. it should not be re-packaged) as a chunk by webpack.

As we want to be able to drop in newer versions of the library without having to recompile the application.

So in theory the hosted application structure would look like this

--public

[login to view URL] < base html page

[login to view URL] < Application - Loaded from [login to view URL]

[login to view URL] < Application - Loaded from [login to view URL]

[login to view URL] < library - lazy Loaded by [login to view URL]

Please use npm for dependencies. You can save the shell projects to github or gitlab for review/delivery.

AngularJS

Project ID: #15673766

About the project