Aot compilation failed about ng2-nouislider

[tb]

Can someone provide PR with this? I think it will require changes similar to pleerock/ngx-modal@8cbd68c Instad of gulp task it should be possible to use "scripts".

[dicbrus]

what is PR? (sorry, i don't know)

[tb]

PR is pull request

[kkotak]

Any eta or thoughts on how complex a fix this might be? Thanks.

[LTMXcitrus]

I have the same problem and it seems that it could be because of missing metadata.json file:
angular/angular #11262
angular/angular #11262

[tb]

@LTMXcitrus Maybe you can take a look at 249c71b I have metadata.json generated but I was not able to install it with npm i ../ng2-nouislider/ng2-nouislider-1.5.0.tgz in angular2webpack2-starter

ngc -p tsconfig.aot.json

can't resolve module /Users/tb/projects/node/angular2webpack2-starter/node_modules/ng2-nouislider/src/nouislider.d.ts from /Users/tb/projects/node/angular2webpack2-starter/node_modules/ng2-nouislider/src/nouislider.d.ts
Error: Source file /Users/tb/projects/node/angular2webpack2-starter/node_modules/ng2-nouislider/src/nouislider.ts not present in program.

I followed https://medium.com/@isaacplmann/getting-your-angular-2-library-ready-for-aot-90d1347bcad#.ggl9b9igq

[ryan-morris]

Any luck with this?

[berndartmueller]

@ryan-morris I forked the repo and managed to get AoT running. I had to remove the reference to the original nouislider file to get it compiled. To use the ng2-nouislider you have to either include the nouislider js file via a script tag or bundle it in you vendor js file.

https://github.com/berndartmueller/ng2-nouislider/tree/handle-config-change

My fork is still not 100% working and I also added a destroy of the slider whenever the @input config of the angular component changes. I have to make a correct pull request, or maybe someone else can do that.

[ryan-morris]

Thanks @berndartmueller . I have another issue that I need to sort out first, then I'll give your changes a try

[surfercoder]

@berndartmueller thanks for the solution but it did not work for me. I am working with angular-cli version 1.0.0-beta.26 and after adding both files to angular-cli.json file within scripts section:

  "scripts": [
    "../node_modules/moment/min/moment.min.js",
    "../node_modules/ng2-nouislider/src/nouislider.js",
    "../node_modules/nouislider/distribute/nouislider.js"
  ],

When I run "ng build --prod --aot" I am getting the following error:

ERROR in Unexpected value 'NouisliderComponent in /Users/agustin/Documents/projects/surfercoder/arc10/node_modules/ng2-nouislider/src/nouislider.d.ts' declared by the module 'WizardModule in /Users/agustin/Documents/projects/surfercoder/arc10/src/app/login/talent/wizard/wizard.module.ts'

ERROR in ./src/main.ts
Module not found: Error: Can't resolve './$$_gendir/app/app.module.ngfactory' in '/Users/agustin/Documents/projects/surfercoder/arc10/src'
@ ./src/main.ts 4:0-74
@ multi ./src/main.ts

However, it is working just for "ng build --prod" but as you know, the size of the resulting files is considerably bigger.

I have tried only with ng2-nouislider and nouislider separately and got the same error. If someone was facing the same scenario and could fix it, I really appreciate the solution!

Thanks in advance.

[ryan-morris]

I am experiencing the same issue as @surfercoder when trying to ng build --prod --aot

[tb]

Fixed with 1.5.0 release

[surfercoder]

Hi @tb! Thanks a lot for you huge help. After updating to latest version ("ng2-nouislider": "^1.5.0"), when I try build the app with AoT running "ng build --prod --aot" I am getting the following error message:

ERROR in ./~/ng2-nouislider/src/nouislider.ts
Module build failed: TypeError: Cannot read property 'text' of undefined
at Object.getTokenPosOfNode (/Users/agustin/Documents/projects/surfercoder/arc10/node_modules/typescript/lib/typescript.js:5692:71)
at IdentifierObject.TokenOrIdentifierObject.getStart (/Users/agustin/Documents/projects/surfercoder/arc10/node_modules/typescript/lib/typescript.js:53623:23)
at IdentifierObject.TokenOrIdentifierObject.getText (/Users/agustin/Documents/projects/surfercoder/arc10/node_modules/typescript/lib/typescript.js:53644:77)
at /Users/agustin/Documents/projects/surfercoder/arc10/node_modules/@ngtools/webpack/src/loader.js:119:42
at Array.filter (native)
at /Users/agustin/Documents/projects/surfercoder/arc10/node_modules/@ngtools/webpack/src/loader.js:118:14
at Array.forEach (native)
at _removeDecorators (/Users/agustin/Documents/projects/surfercoder/arc10/node_modules/@ngtools/webpack/src/loader.js:109:10)
at /Users/agustin/Documents/projects/surfercoder/arc10/node_modules/@ngtools/webpack/src/loader.js:282:48
@ ./src/$$_gendir/app/app.module.ngfactory.ts 23:0-58
@ ./src/main.ts
@ multi ./src/main.ts

I am also using the latest angular-cli ("@angular/cli": "1.0.0-beta.30").

If anyone is facing the same situation and has solved it, the fix will be more than appreciated.

Thanks in advance.

Best regards.

[ryan-morris]

@surfercoder I have seen the same issue . I believe it's an angular-cli problem at the moment. In package.json try to set "@ngtools/webpack": "1.2.3"

[surfercoder]

@ryan-morris Thanks a lot for your huge help, I tried with all posible options, this means, installing it as dev dependency as regular dependency, local to the project and even globally (the installed version was newer than the one you mentioned, it is 1.2.8) and the same error:

I installed it in the following four ways:

npm i @ngtools/webpack -S
npm i @ngtools/webpack -D
npm i @ngtools/webpack
npm i @ngtools/webpack -g

And I got the same error. I think it could be something with the new angular-cli as you mentioned but anyway, is still not working for me :(

Thanks again for your help and please let me know if anyone find the fix for this.

Best regards.

[ryan-morris]

@surfercoder

I'm not sure which specifically may have fixed it for me. Also had to modify rxjs version for an unrelated error message. Here is my full deps just in case this helps figure out the source of the problem

"dependencies": {
    "@angular/common": "^2.4.5",
    "@angular/compiler": "^2.4.5",
    "@angular/core": "^2.4.5",
    "@angular/forms": "^2.4.5",
    "@angular/http": "^2.4.5",
    "@angular/platform-browser": "^2.4.5",
    "@angular/platform-browser-dynamic": "^2.4.5",
    "@angular/router": "^3.4.5",
    "@ng-bootstrap/ng-bootstrap": "^1.0.0-alpha.18",
    "angular2-moment": "^1.0.0-beta.rc.1",
    "core-js": "^2.4.1",
    "intl": "^1.2.5",
    "moment": "2.15.2",
    "ng2-nouislider": "1.5.0",
    "ng2-webstorage": "^1.5.0",
    "nouislider": "^9.0.0",
    "rxjs": "5.0.1",
    "ts-helpers": "^1.1.1",
    "zone.js": "^0.7.2",
    "@ngtools/webpack": "1.2.3"
  },
  "devDependencies": {
    "@angular/cli": "^1.0.0-beta.30",
    "@angular/compiler-cli": "^2.4.5",
    "@ngtools/webpack": "^1.2.4",
    "@types/jasmine": "2.5.38",
    "@types/node": "^6.0.42",
    "codelyzer": "~2.0.0-beta.1",
    "jasmine-core": "2.5.2",
    "jasmine-spec-reporter": "2.5.0",
    "karma": "1.2.0",
    "karma-chrome-launcher": "^2.0.0",
    "karma-cli": "^1.0.1",
    "karma-jasmine": "^1.0.2",
    "karma-remap-istanbul": "^0.2.1",
    "protractor": "~4.0.13",
    "ts-node": "1.2.1",
    "tslint": "^4.3.0",
    "typescript": "~2.1.5"
  }

[kkotak]

Looks like "@ngtools/webpack": "1.2.3" did the trick for me. Thanks.

[surfercoder]

@ryan-morris and @kkotak: thanks a lot for you help, as you said, just adding "@ngtools/webpack": "1.2.3" to my dev dependencies (this is important to be clarified) was more than good enough to have not only "ng build --prod" but also "ng build --prod --aot" running again!

You have saved me a lot of time, effort and space on the hosting server ;)

Have a good one!

[roaringbits]

This fixed the issue for me too! Thanks!

[itslenny]

@tb Can you explain how you fixed this? I'm seeing the same issue in another ng2 module and trying to resolve it. thanks. ( the issue if you're curious seveves/angular-vis#26 )

[tb]

@itslenny Sure! Fix is described in #59 (comment)