Angular 2 - module exchange between different ng2 applications

Question

I have a module problem between ng2 applications. Here is a very simple script to demonstrate the problem. Using angular-cli completely:

• There is a SharedModule application created using ng new SharedModule .
• There is a MyApp application created using ng new MyApp .
• The module in the SharedModule application exports a custom component (which I would like to use in the MyApp application).
• The main module in MyApp imports the module from the SharedModule application.
• When you try to start MyApp using ng serve it is deleted with an error:

  An error encountered character resolution values. Call function 'makeDecorator', function calls are not supported. Consider replacing a function or lambda with a link to an exported function ...

Omitting not very important material, the basic structure looks like this:

 MyApp |────angular-cli.json |────package.json | └──src └─app |────app.module.ts |────app-root.component.ts └─ SharedModule |────angular-cli.json |────package.json | └─src └─app |────app-root.component.ts |────custom-input.component.ts |────shared.module.ts └─ 

The key point here is that MyApp and SharedModule are two different applications. If I try to put the general module inside MyApp (along with the exported custom component), then it will work fine. Unfortunately, this is not an option now, and I have to keep the modules / applications separate. Also, creating an npm package from SharedModule and installing it in MyApp is not an option.

I created a github repository demonstrating the problem. To run it:

• run npm install in the MyApp and SharedModule folders.
• run npm start in the MyApp folder.

A million dollar question is how can I do this? Thanks.

Answer 1

I would say that the problem is that the Angular CLI now uses the AoT Compile by default.

Thus, the SharedModule that you import should be subject to statistical analysis so that it can be created with your MyApp.

When creating an application using the CLI, it does not expect you to use it as a shared library and thus does not include the necessary *.metadata.json files that the AoT compiler should parse.

I could explain it further, but this is a great article about it on Medium, where I found out about it:

Getting your Angular 2 library for AoT

Hope this helps too.

EDIT:

There are also a couple of Angular 2 libraries that encountered this problem when updating the CLI. To name a couple of issues that might help you:

Tag input

Clarity

Answer 2

Now you can share your modules between applications in angular. Just follow this guide to using multiple applications in an angular project , in the guide it puts two applications in angular-cli.json and can publish and maintain them separately with the -app flag:

  ng serve --app 0 ng build --app 1 

or like this:

  ng serve --app app1 ng build --app app2 

I tested this myself, but struggled for a while, so I asked myself the question: Divide the module between several angular applications that are in the same project .

Answer 3

post your SharedApp to github and then public to npmjs.

in MyApp, just npm install --save your/shared-app , then use SharedApp in MyApp