Can I reuse components across apps?

Question

I am new to Angular2 and I am interested in finding out if there is a possibility of reusing entire sets of presentation components from within one application in another application?

For example I have an Angular 2 application called MyApp and in this I have some common components that I created, these are located in the app/components/common folder and each contain a TypeScript, Sass and HTML file.

I use Gulp to compile the TypeScript to JS and Sass to CSS.

I now release that these common components can be common across my other Angular 2 apps and as such I want to use them in a separate Angular 2 app called MyOtherApp.

I want to be able to pull all of the common components out of MyApp and be able to use them in MyOtherApp.

Is this possible? If so what is the best approach to this type of common sharing of components?

As I said I am using Gulp for building/running, and also System.js for config setup of the Angular apps.

I can share some code of what I have tried if required but I am unsure as to what is helpful to share so please request what might be useful and I will share.

Answer 1

I think the most general way is to build a separate library that publishes NgModule - just like Angular itself, Angular Material 2 library, and others do. However it requires more effort to setup build script for library and makes it more difficult to debug.

Another option is to have a single TypeScript project for all applications with different entry point files with Angular bootstrap function for each project