Components: AOT support

[daniele-zurico]

Bug, feature request, or proposal:

Hi I'm trying to compile my project in aot mode but it fail in 2 components with these errors:

ERROR in ./src/compiled/~/@angular/material/dialog/dialog-container.ngfactory.ts
Module parse failed: /Users/danielezurico/Desktop/molson/app-nest-molson-ui-promotions/src/compiled/node_modules/@angular/material/dialog/dialog-container.ngfactory.ts Unexpected token (29:9)
You may need an appropriate loader to handle this file type.
| import * as import20 from '@angular/core/src/linker/component_factory_resolver';
| export class Wrapper_MdDialogContainer {
|   context:import0.MdDialogContainer;
|   changed:boolean;
|   /*private*/ _expr_0:any;
 @ ./src/compiled/containers/components/wrapper/WrapperModule.ngfactory.ts 112:16-100
 @ ./src/index.aot.ts

ERROR in ./src/compiled/~/@angular/material/snack-bar/snack-bar-container.ngfactory.ts
Module parse failed: /Users/danielezurico/Desktop/molson/app-nest-molson-ui-promotions/src/compiled/node_modules/@angular/material/snack-bar/snack-bar-container.ngfactory.ts Unexpected token (32:9)
You may need an appropriate loader to handle this file type.
| import * as import23 from '@angular/core/src/linker/component_factory_resolver';
| export class Wrapper_MdSnackBarContainer {
|   context:import0.MdSnackBarContainer;
|   changed:boolean;
|   constructor(p0:any) {
 @ ./src/compiled/containers/components/wrapper/WrapperModule.ngfactory.ts 113:16-106
 @ ./src/index.aot.ts

ERROR in ./src/compiled/~/@angular/material/snack-bar/simple-snack-bar.ngfactory.ts
Module parse failed: /Users/danielezurico/Desktop/molson/app-nest-molson-ui-promotions/src/compiled/node_modules/@angular/material/snack-bar/simple-snack-bar.ngfactory.ts Unexpected token (23:9)
You may need an appropriate loader to handle this file type.
| import * as import14 from '../../common/src/directives/ng_if.ngfactory';
| export class Wrapper_SimpleSnackBar {
|   context:import0.SimpleSnackBar;
|   changed:boolean;
|   constructor() {
 @ ./src/compiled/containers/components/wrapper/WrapperModule.ngfactory.ts 114:16-103
 @ ./src/index.aot.ts

ERROR in ./src/compiled/~/@angular/material/tooltip/tooltip.ngfactory.ts
Module parse failed: /Users/danielezurico/Desktop/molson/app-nest-molson-ui-promotions/src/compiled/node_modules/@angular/material/tooltip/tooltip.ngfactory.ts Unexpected token (29:62)
You may need an appropriate loader to handle this file type.
| import * as import20 from '@angular/core/src/animation/animation_player';
| import * as import21 from '@angular/core/src/security';
| class MdTooltipModuleInjector extends import0.NgModuleInjector<import1.MdTooltipModule> {
|   _PortalModule_0:import2.PortalModule;
|   _OverlayModule_1:import3.OverlayModule;
 @ ./src/compiled/containers/components/wrapper/WrapperModule.ngfactory.ts 115:16-92
 @ ./src/index.aot.ts

Version "@angular/material": "^2.0.0-alpha.10",

[jelbourn]

@daniele-zurico it looks like you're trying to load the generated .ts files into the browser directly, which won't work- you need to compile them to javascript first.

You can see an example of an app that's using @angular/material with AoT here:
https://github.com/jelbourn/material2-app

[mrdulin]

same issue

ERROR in ./compiled/aot/node_modules/@angular/material/typings/index.ngfactory.ts
Module parse failed: /Users/elsa/workspace/angular4-ts-webpack2/compiled/aot/node_modules/@angular/material/typings/index.ngfactory.ts Unexpected token (16:34)
You may need an appropriate loader to handle this file type.
| import * as i5 from '@angular/forms';
| import * as i6 from '@angular/http';
| export const MdCoreModuleNgFactory:i0.NgModuleFactory<i1.MdCoreModule> = i0.ɵcmf(i1.MdCoreModule,
|     ([] as any[]),(_l:any) => {
|       return i0.ɵmod([i0.ɵmpd(512,i0.ComponentFactoryResolver,i0.ɵCodegenComponentFactoryResolver,
 @ ./compiled/aot/src/app.component.ngfactory.ts 10:9-77
 @ ./compiled/aot/src/app.module.ngfactory.ts
 @ ./src/main-aot.ts

[aparraga]

did anyone solve this issue? now we are experiencing the same

[chrisvfabio]

Removing include: /ClientApp/ from webpack.config.js fixes the error for me.
See more here: https://github.com/aspnet/JavaScriptServices/issues/1168#issuecomment-320026397

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{_This action has been performed automatically by a bot._}