angular: NoOpAnimationDriver error with ng-xi18n

I’m submitting a … (check one with “x”)

[x] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question

Current behavior ng-xi18n with angular 2.4.0 fails with exception Error: Error encountered resolving symbol values statically. Calling function 'NoOpAnimationDriver'. Builds fine with ng build --prod or ng serve.

Expected behavior Extract xlf without errors

Please tell us about your environment: angular-cli: 1.0.0-beta.24 node: 6.2.2 os: win32 x64

  • Angular version: 2.4.0

  • Browser: n/a

  • Language: TypeScript 2.0.3

  • Node (for AoT issues): node --version = node: 6.2.2

About this issue

  • Original URL
  • State: closed
  • Created 8 years ago
  • Comments: 27 (5 by maintainers)

Most upvoted comments

Excluding the “test.ts” file in tsconfig.json resolved the issue for me.

... "exclude": [ "test.ts" ], "angularCompilerOptions": { "genDir": "../locale" } ...

I’m getting this error but as far as I can remember I’m not trying to use i18 in any part of my project. Is this coming from Material 2? Are there any commonly known modules that raise this issue? I can’t start ngc nor ng build --prod or ng build --aot

I’m getting the infamous ERROR in Error encountered resolving symbol values statically. Calling function 'NoOpAnimationDriver'... error

UPDATE SOLUTION @hansl @chuckjaz @tbosch @matsko

It turns out this is not an issue with i18 at all. The error message shown are simply IRRELEVANT. I found an old project that has worked with --aot and I tried all possible combinations with the tsconfig.json from that old project and got it working. WELL, it is not really working straight away, but it shows some very helpful errors that I needed to resolve until --aot compiles successfully. In my case, the compiler was complaining about relative URLs to images in the assets folder from different component’s .css files as being not found. I fixed all of them and --aot compiled correctly.

*I have WebStorm compile all scss files to css and reference the .css files from my component’s styleUrls instead of using ng-cli’s built in scss loader, if that’s relevant.

{
    "files": [
        "app/app.module.ts", // Added to my 'broken' tsconfig, relative to `/src`
        "main.ts", // this too
        "typings.d.ts" // this too
    ],
    "angularCompilerOptions": {
        "genDir": "aot", // Forgot what my intial value was, but I THINK I changed this
        "skipMetadataEmit": true  // After adding this, the compiler showed me the helpful errors
    },
    "compilerOptions": {
        "baseUrl": "",
        "declaration": false,
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "lib": [
            "es6", // I think I changed this from es2015 to es6
            "dom"
        ],
        "mapRoot": "./",
        "module": "es2015",  // Forgot what my intial value was, but I THINK I changed this
        "moduleResolution": "node",
        "outDir": "../dist/out-tsc",
        "sourceMap": true,
        "target": "es5",
        "typeRoots": [
            "../node_modules/@types"
        ]
    }
}

I also noticed that there is no difference in the output files when using --prod or --prod --aot, is --aot the default now when using --prod?

Following people’s recommendation I can confirm I was able to get around this issue by

  1. Adding "exclude": [ "test.ts" ] to the tsconfig.json file

  2. Specifying the tsconfig.json path in the command: "./node_modules/.bin/ng-xi18n" -p src/tsconfig.json as this is where the angular-cli added mine by default

  3. Changing all scss imports to (for example) @import "filename.scss" WITH the filename extension

  4. Fixing any errors as they came up, tended to be with .spec.ts files where I am have accidentally missed things. Can still run ng-serve but the i18n command needed everything fixed

@rexthk if the tsconfig.json TypeScript configuration file is located somewhere other than in the root folder, you must identify the path to it with the -p option: ./node_modules/.bin/ng-xi18n -p src/tsconfig.json

In case you’re using wallabyJs, also exclude wallabyTest.ts in your tsconfig.json:

 "exclude": [ "test.ts", "wallabyTest.ts" ],

Note that the BrowserTestingModule will be compiled, leading to this error, as soon at least one test that uses the TestBed is included in the AoT compilation.

You can exclude files from the compilation by setting the files property in the tsconfig.json, or using exclude.

On Thu, Dec 22, 2016 at 9:16 AM Chuck Jazdzewski notifications@github.com wrote:

Can you make sure the BrowserTestingModule is not include in the project being compiled?

BrowserTestingModule is not intended to be used by AOT and will generate this error because it includes: {provide: AnimationDriver, useValue: AnimationDriver.NOOP} for whichNOOP is a reference to new NoOpAnimationDriver(); which is the expression the error is referring to.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/angular/angular/issues/13624#issuecomment-268846297, or mute the thread https://github.com/notifications/unsubscribe-auth/AAqKfzVtUNBKdIW4b0HmRQ1233X4Qzqxks5rKrB8gaJpZM4LThk0 .

When you exclude test.ts in tsconfig.json ng lint does not work anymore 😃

#3993