Geek Answers Handbook

Angular2, metadata error when precompiling a function module

I am writing an Angular2 library using Angular2 RC6.

This library contains one module:

import { Component, OnInit, NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; @Component({ selector: 'yeva', template: '<div></div>' }) export class YevaComponent { constructor() { } } @NgModule({ imports: [CommonModule], declarations: [YevaComponent], providers: [], exports: [YevaComponent] }) export class YevaModule { }

If I copy this code to a TypeScript file in an existing Angular2 application and try to use this module directly, it works fine ...

But my goal here is to build an external npm library.

If I translate this exact code in a standalone project:

https://github.com/ClementVidal/starter.yeva

(This project is configured to be used as an Angular2 library, where it compiles using TypeScript to be used by my client application.)

I get the following error:

Unexpected value "YevaModule" imported by the module "AppModule"

This is how I import my module in BOTH cases:

 @NgModule({ imports: [BrowserModule,YevaModule], declarations: [AppComponent], providers: [ FOUNDATION_PROVIDERS ], bootstrap: [AppComponent] }) export class AppModule { }

This error comes from the Angular compiler:

 var importedMeta = _this.getNgModuleMetadata(importedModuleType, false); if (importedMeta === null) { throw new Error("Unexpected " + _this._getTypeDescriptor(importedType) + " '" + stringify(importedType) + "' imported by the module '" + stringify(moduleType) + "'"); }

It seems that my module when importing as a precompiled module does not contain metadata .

I tried to figure this out by looking at the compiled code, but found nothing ...

Here's how to reproduce this error:

 mkdir test-metadata cd test-metadata git clone git@github.com :ClementVidal/starter.yeva.git git clone git@github.com :ClementVidal/starter.themba.git cd starter.yeva npm install sudo npm link cd ../starter.themba git checkout module-metadata sudo npm link __TITLE__ npm install npm run server

Then go to http: // localhost: 8080 /

Are any of you already experimenting with this type of problem?

+5
source share
2 answers

It seems that one or more metadata files should be provided by the author of the library, one for each .d.ts definition .d.ts . Metadata files are created by the Angular AOT compiler (angular-cli).

Here are links to it, right from angular:

Here is an example of a library author applying changes to support the AOT compiler:

I also add support for another library and present it as PR

NTN

+2
source

Have you tried without a link to npm? Maybe the problem is here; I know webpack is fighting this ...

Indeed, installing your library from npm might work. You should try to release the alpha version to check, because I do not see anything bad in your code.

0
source

More articles:


All Articles