Cannot AOT Compile Toasy or DnD

[kristoffergustavsson]

• I'm submitting a ... [x] bug report [ ] feature request [ ] question about the decisions made in the repository
• Do you want to request a feature or report a bug?
• What is the current behavior? When i compile with Toasty or Dnd included I get an error:

D:\dev\Ahead-of-Time\QUICKSTART_AoT>"node_modules/.bin/ngc" -p tsconfig-aot.json
Error: Error encountered resolving symbol values statically. Function calls are not supported. Consider replacing the function or lambda with a reference to an exported function, resolving symbol AppModule in D:/dev/Ahead-of-Time/QUICKSTART_AoT/app/app.module.ts, resolving symbol AppModule in D:/dev/Ahead-of-Time/QUICKSTART_AoT/app/app.module.ts
    at simplifyInContext (D:\dev\Ahead-of-Time\QUICKSTART_AoT\node_modules\@angular\compiler-cli\src\static_reflector.js:472:23)
    at StaticReflector.simplify (D:\dev\Ahead-of-Time\QUICKSTART_AoT\node_modules\@angular\compiler-cli\src\static_reflector.js:475:22)
    at StaticReflector.annotations (D:\dev\Ahead-of-Time\QUICKSTART_AoT\node_modules\@angular\compiler-cli\src\static_reflector.js:61:36)
    at _loop_1 (D:\dev\Ahead-of-Time\QUICKSTART_AoT\node_modules\@angular\compiler-cli\src\codegen.js:67:54)
    at CodeGeneratorModuleCollector.readFileMetadata (D:\dev\Ahead-of-Time\QUICKSTART_AoT\node_modules\@angular\compiler-cli\src\codegen.js:80:13)
    at D:\dev\Ahead-of-Time\QUICKSTART_AoT\node_modules\@angular\compiler-cli\src\codegen.js:42:74
    at Array.map (native)
    at CodeGeneratorModuleCollector.getModuleSymbols (D:\dev\Ahead-of-Time\QUICKSTART_AoT\node_modules\@angular\compiler-cli\src\codegen.js:42:35)
    at CodeGenerator.codegen (D:\dev\Ahead-of-Time\QUICKSTART_AoT\node_modules\@angular\compiler-cli\src\codegen.js:121:39)
    at codegen (D:\dev\Ahead-of-Time\QUICKSTART_AoT\node_modules\@angular\compiler-cli\src\main.js:7:81)
Compilation failed

• If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem via https://plnkr.co or similar. I use Angular AOT tutorial and just add reference to Toasty. https://angular.io/docs/ts/latest/cookbook/aot-compiler.html

app.module:

import { NgModule }      from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { ToastyModule } from 'ng2-toasty';

import { AppComponent }   from './app.component';

@NgModule({
  imports:
  [
    BrowserModule,
    ToastyModule.forRoot()
  ],
  declarations: [ AppComponent ],
  bootstrap:    [ AppComponent ]
})

export class AppModule { }

• What is the expected behavior? No errors when compiling
• What is the motivation / use case for changing the behavior?
• Please tell us about your environment:
• Angular version: 2.1.0
• Browser: [all ]
• Other information (e.g. detailed explanation, stacktraces, related issues, suggestions how to fix, links for us to have context, eg. stackoverflow, gitter, etc)

[tomasisby]

A complement to this bug report. There is nothing wrong with the actual modules. If I add the ts-files in my project and compile it with them, they work and the CLI compiles the project. I think it has something to do with the js-files being built as system modules. The CLI doesn't seem to like that. The tsconfig when compiling should use es2015 modules so tree shaking can be done. I don't really know how to build a node module that works in both environment. ng-bootstrap is packaged in a similar way but use webpack and it works with the CLI.

[dzamula]

+1

The library needs to be built with ngc compiler instead of tsc as described here

[anil1712]

@akserg are you going to make this changes to support compilation with ngc?

[Utwo]

+1

[tomtobac]

+1

[akserg]

Hi All, Sorry for the delayed response. I have merged the aot into the master branch, and AOT must be available from version 2.2.0. Please try it and let me know about all issues you will have.

[Marcelh1983]

I tried 2.2.0. I get this error while building AOT.

Can't bind to 'ngClass' since it isn't a known property of 'div'. (" <div id="toasty" [ERROR ->][ngClass]="[position]"> <ng2-toast *ngFor="let toast of toasts" [toast]="toast" (closeToast)="): ToastyComponent@1:21 Can't bind to 'ngForOf' since it isn't a known property of 'ng2-toast'.

[akserg]

Hi @Marcelh29, That issue was fixed in 2.2.1. Please use latest 2.2.2 from npm.

[Marcelh1983]

@akserg Thanks! problem is solved.

[akserg]

Thank you for your patient.