Creating a library in angular to be used in any project

Question

I am trying to create an application in angular version 6 which can generate js as output where the application can be embedded directly in any application.

Eg.

 <div id="entryID"/> <script src="angularapp.js"></script> <script> AngularApp.App({ inputParam1: 'param1' user: { id: 'userid' }, resize: 'detect' }, document.getElementById("entryID")); </script> 

Here entryID is used for the div to initialize the application and fit in the div

Answer 1

You should take a look at Angular Elements . It's a part of the Angular project, and it's function is pretty much what you want: creating a .js file, that, if imported, will allow you to use components in any environment.

It works using custom elements , basically registering the component in the browser so you can use them anywhere, as long as you import the .js files.

Note that the generated .js files are pretty massive, as they include the entire Angular library itself.

Support is even included for Internet Explorer , if you use the correct polyfills.