Naveed Ahmed
Naveed Ahmed

Reputation: 10386

Angular 2 RC 6 AoT Compiler not working

I just updated my project to Angular 2 RC 6. I am now trying to use Ahead of Time (AoT) Compilation as mentioned in blog post http://angularjs.blogspot.com/ but no success.

I am not using angular cli as I building project in ASP.Net.

As the blog post suggests, I have installed @angular/compiler-cli

But when I try to run ngc from command prompt it gives error

'ngc' is not recognized as an internal or external command,
operable program or batch file.


npm run ngc
npm ERR! Windows_NT 10.0.10586
npm ERR! argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "run" "ngc"
npm ERR! node v6.4.0
npm ERR! npm  v3.10.3

npm ERR! missing script: ngc
npm ERR!
npm ERR! If you need help, you may report this error at:
npm ERR!     <https://github.com/npm/npm/issues>

npm ERR! Please include the following file with any support request:
npm ERR!     D:\Project\App\npm-debug.log

Can anyone please guide how to use AoT compiler with ASP.Net Project. Or when you are not using Angular CLI but building components etc manually.

Edit

I now managed to run ngc by first moving to ./node_modules/.bin/ and then running

ngc -p D:\Project\App

But now the compiler is throwing the below error:

When I try to compile my project with ngc, it throws the below error:

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 (position 92:25 in the original .ts file), resolving symbol AppModule in

In my App Module I have the below providers and probably this is causing the project. I am not sure what exactly is wrong with this?

providers: [
        GlobalService,
        {
            provide: Http,
            useFactory: (backend: XHRBackend, defaultOptions: RequestOptions, globalService: GlobalService) => new HttpLoading(backend, defaultOptions, globalService),
            deps: [XHRBackend, RequestOptions, GlobalService]
        }
    ],

Upvotes: 6

Views: 4689

Answers (4)

AiShiguang
AiShiguang

Reputation: 1029

Probably it is that you have function calls in your @NgModule definitions. I have to remove some dynamic providers to make it work for me.

Maybe you should try to replace your 'useFactory: (...)=>{...}' or at least test commenting it.

Upvotes: 0

cobolstinks
cobolstinks

Reputation: 7153

I was running into this issue using

"@angular/compiler-cli": "^4.0.1"

For me deleting /node_modules/@angular folder and running

npm install

Seemed to resolve my issue. My copy of the package must have gotten mucked up

Upvotes: 1

TetraDev
TetraDev

Reputation: 17094

Problem 1

When running scripts from package.json or "npm scripts", to fix the path issue on Windows 10, you need to wrap the directory_path in double quotes, and escape each double quote with a backslash:

"compile:aot": \"./node_modules/.bin/ngc\" -p src

This would execute the ngc program located in ./node_modules/.bin with -p src arguments.

Otherwise, you have to cd ./node_modules/.bin && ngc -p src as 2 different commands.

Problem 2

Currently it seems that AOT compilation for angular 2 has a problem with require() statements. So if you want to eliminate the compilation errors, you have to remove all require() statements from your app.

Obviously, this is a bad idea since there is value to require(), especially when working with Webpack or other module bundlers. We have to wait for a solution from the angular2 team.

Upvotes: 0

Mark Pieszak - Trilon.io
Mark Pieszak - Trilon.io

Reputation: 67021

        GlobalService,
        {
            provider: Http, // <-- I believe you were missing the "r" in provide"r"
        }

Take a look at the rc6 breaking changes:

https://github.com/angular/angular/blob/master/CHANGELOG.md#breaking-changes

Upvotes: 2

Related Questions