Ionic-app-scripts: Build error using --prod in latest Ionic 2.2 and latest Angular 2.4.x

Created on 9 Mar 2017  路  10Comments  路  Source: ionic-team/ionic-app-scripts

Short description of the problem:

ionic build --prod fails with this error:

[11:39:29]  build prod failed: Error encountered resolving symbol values statically. Calling function
            'NoOpAnimationDriver', function calls are not supported. Consider replacing the function or lambda with a
            reference to an exported function, resolving symbol AnimationDriver.NOOP in
            C:/dev/mckissock/mckissock-mobile/node_modules/@angular/platform-browser/src/dom/animation_driver.d.ts,
            resolving symbol BrowserTestingModule in
            C:/dev/mckissock/mckissock-mobile/node_modules/@angular/platform-browser/testing/browser.d.ts, resolving
            symbol BrowserTestingModule in
            C:/dev/mckissock/mckissock-mobile/node_modules/@angular/platform-browser/testing/browser.d.ts
[11:39:29]  ionic-app-script task: "build"
[11:39:29]  Error: Error encountered resolving symbol values statically. Calling function 'NoOpAnimationDriver',
            function calls are not supported. Consider replacing the function or lambda with a reference to an exported 
            function, resolving symbol AnimationDriver.NOOP in
            C:/dev/mckissock/mckissock-mobile/node_modules/@angular/platform-browser/src/dom/animation_driver.d.ts,
            resolving symbol BrowserTestingModule in
            C:/dev/mckissock/mckissock-mobile/node_modules/@angular/platform-browser/testing/browser.d.ts, resolving
            symbol BrowserTestingModule in
            C:/dev/mckissock/mckissock-mobile/node_modules/@angular/platform-browser/testing/browser.d.ts
Error: Error encountered resolving symbol values statically. Calling function 'NoOpAnimationDriver', function calls are not supported. Consider replacing the function or lambda with a reference to an exported function, resolving symbol AnimationDriver.NOOP in C:/dev/mckissock/mckissock-mobile/node_modules/@angular/platform-browser/src/dom/animation_driver.d.ts, resolving symbol BrowserTestingModule in C:/dev/mckissock/mckissock-mobile/node_modules/@angular/platform-browser/testing/browser.d.ts, resolving symbol BrowserTestingModule in C:/dev/mckissock/mckissock-mobile/node_modules/@angular/platform-browser/testing/browser.d.ts
    at SyntaxError.BaseError [as constructor] (C:\dev\mckissock\mckissock-mobile\node_modules\@angular\compiler\bundles\compiler.umd.js:1597:31)
    at new SyntaxError (C:\dev\mckissock\mckissock-mobile\node_modules\@angular\compiler\bundles\compiler.umd.js:1795:20)
    at simplifyInContext (C:\dev\mckissock\mckissock-mobile\node_modules\@angular\compiler\bundles\compiler.umd.js:25783:27)
    at StaticReflector.simplify (C:\dev\mckissock\mckissock-mobile\node_modules\@angular\compiler\bundles\compiler.umd.js:25795:17)
    at StaticReflector.annotations (C:\dev\mckissock\mckissock-mobile\node_modules\@angular\compiler\bundles\compiler.umd.js:25291:64)
    at NgModuleResolver.resolve (C:\dev\mckissock\mckissock-mobile\node_modules\@angular\compiler\bundles\compiler.umd.js:17771:86)
    at CompileMetadataResolver.getNgModuleMetadata (C:\dev\mckissock\mckissock-mobile\node_modules\@angular\compiler\bundles\compiler.umd.js:18272:64)
    at CompileMetadataResolver.getNgModuleSummary (C:\dev\mckissock\mckissock-mobile\node_modules\@angular\compiler\bundles\compiler.umd.js:18228:56)
    at C:\dev\mckissock\mckissock-mobile\node_modules\@angular\compiler\bundles\compiler.umd.js:18318:72
    at Array.forEach (native)

Steps to reproduce:

  1. $ ionic build browser --prod

Which @ionic/app-scripts version are you using?

1.1.4

Other information: (e.g. stacktraces, related issues, suggestions how to fix, stackoverflow links, forum links, etc)

Package.json fragments:

  "scripts": {
    "ionic:build": "ionic-app-scripts build && gulp default --gulpfile build_gulpfile.js",
    "ionic:serve": "ionic-app-scripts serve --sourceMap source-map --iscordovaserve --wwwDir platforms/browser/www/ --buildDir platforms/browser/www/build",
    "build": "ionic-app-scripts build && gulp default --gulpfile build_gulpfile.js",
    "build-prod-browser": "ionic-app-scripts build browser --prod --release && gulp browser --gulpfile build_gulpfile.js",
    "build-dev-browser": "ionic-app-scripts build browser --sourceMap source-map --dev && gulp browser --gulpfile build_gulpfile.js",
    "watch": "ionic-app-scripts watch --sourceMap source-map",
    "emulate:before": "build",
    "deploy:before": "build",
    "build:before": "build",
    "run:before": "build"
  },
  "dependencies": {
    "@angular/common": "2.4.8",
    "@angular/compiler": "2.4.8",
    "@angular/compiler-cli": "2.4.8",
    "@angular/core": "2.4.8",
    "@angular/forms": "2.4.8",
    "@angular/http": "2.4.8",
    "@angular/platform-browser": "2.4.8",
    "@angular/platform-browser-dynamic": "2.4.8",
    "@angular/platform-server": "2.4.8",
    "@ionic/storage": "2.0.0",
    "ionic-angular": "2.2.0",
    "ionic-native": "2.4.1",
    "ionicons": "3.0.0",
    "rxjs": "5.0.1",
    "sw-toolbox": "3.4.0",
    "zone.js": "0.7.2",
    "del": "2.2.2",
    "gulp": "3.9.1",
    "gulp-cli": "1.2.2",
    "run-sequence": "1.2.2",
    "angular2-cookie": "1.2.6"
  },
  "devDependencies": {
    "@ionic/app-scripts": "1.1.4",
    "@types/jasmine": "2.5.43",
    "@types/node": "7.0.6",
    "codecov": "1.0.1",
    "jasmine-core": "2.5.2",
    "jasmine-spec-reporter": "3.2.0",
    "karma": "1.5.0",
    "karma-chrome-launcher": "2.0.0",
    "karma-jasmine": "1.1.0",
    "karma-mocha-reporter": "2.2.2",
    "karma-remap-istanbul": "0.6.0",
    "ts-node": "2.1.0",
    "tslint": "4.5.1",
    "tslint-eslint-rules": "3.4.0",
    "typescript": "2.2.1"
  },

I found this: http://stackoverflow.com/questions/41815946/angular2-cli-build-prod-error-calling-function-noopanimationdriver-function

I tried using --aot false and it did not resolve the issue.

Most helpful comment

@JustinPierce Thanks. That was it. Here's my updated exclude section, adding test.ts to the exclusion list. Thanks!

  "exclude": [
    "node_modules",
    "src/test.ts"
  ],

All 10 comments

ngc should not see any of your testing files or you will run into major trouble, of which this is part. Exclude them aggressively in tsconfig.json.

My tsconfig.json is the same as the ionic-conference-app.

@morrisonbrett Do you have any test files? The conference app does not, so it would not account for them in its tsconfig.json. Our project does have test files, and excluding everything testing-related via tsconfig.json solved this issue for us.

We have had the same issue after upgrade to 2.2.0 with immutable-js structures. For now we have to stay at 2.1.0. In angular 4.0.0-beta.6 it should be fixed (latest is 4.0.0-rc.2).

Maybe as temporary solution would be great, if we were able to use --aot false flag in ionic.

We have had the same issue after upgrade to 2.2.0 with immutable-js structures.

Are you positive it's the same issue? ngc should never see BrowserTestingModule unless there is some file visible in tsconfig.json that references testing stuff.

I have ended up with excluding the testing modules but now I have problems with:

build prod failed: Error encountered resolving symbol values statically. Could not resolve type Window (position 11:22 in the original .ts file), resolving symbol HttpInterceptor in

Any solution/suggestion? Thanks in advance

@rapropos We are using redux, so whole application state and models are build on immutable-js, not just tests. Error message:
Error encountered resolving symbol values statically. Calling function 'Record', function calls are not supported. Consider replacing the function or lambda with a reference to an exported function, resolving symbol TransactionRecord
points to line, where immutable Record is used.

@kesozjura You're going to have to take that up with whoever's responsible for that code. It's not the same as this issue, which is caused by ngc seeing tests and therefore trying to process BrowserTestingModule, which ends badly.

@JustinPierce Thanks. That was it. Here's my updated exclude section, adding test.ts to the exclusion list. Thanks!

  "exclude": [
    "node_modules",
    "src/test.ts"
  ],

Hello all! Thanks for opening an issue with us! As this seems like more of a support question i will urge that you ask this question on our forum or on our slack channel. Thanks for using Ionic!

Was this page helpful?
0 / 5 - 0 ratings