26

How do I enable Ivy on a Angular 8 or 9 project?

Ivy is the upcoming render engine for Angular which introduces a lot of nice features without changing the current code base of Angular projects.

Jeremy Thille
  • 26,047
  • 12
  • 43
  • 63
Ling Vu
  • 4,740
  • 5
  • 24
  • 45

2 Answers2

32

source and more information go though this

Reference : https://dzone.com/articles/how-to-upgrade-angular-packagesenable-ivy-compiler

you can auto upgrade

npm i -g @angular/cli@latestng update

or in your tsconfig.json file update this

{
  "compilerOptions": {
    "module": "esnext",
    // ...
  },
  "angularCompilerOptions": {
    "enableIvy": true,
    "allowEmptyCodegenFiles": true
  }
}

then your angular.json file

{
  "projects": {
    "your-project": {
      "architect": {
        "build": {
          "options": {
            ...
            "aot": true,
          }
        }
      }
    }
  }
}
Chanaka Weerasinghe
  • 5,404
  • 2
  • 26
  • 39
22

use this official guide.

Using Ivy in a new project :

To start a new project with Ivy enabled, use the --enable-ivy flag with the ng new command:

ng new shiny-ivy-app --enable-ivy

The new project is automatically configured for Ivy. Specifically, the enableIvy option is set to true in the project's tsconfig.app.json file.

Using Ivy in an existing project :

To update an existing project to use Ivy, set the enableIvy option in the angularCompilerOptions in your project's tsconfig.app.json.

{
  "compilerOptions": { ... },
  "angularCompilerOptions": {
    "enableIvy": true
  }
}

AOT compilation with Ivy is faster and should be used by default. In the angular.json workspace configuration file, set the default build options for your project to always use AOT compilation.

{
  "projects": {
    "my-existing-project": {
      "architect": {
        "build": {
          "options": {
            ...
            "aot": true,
          }
        }
      }
    }
  }
}

To stop using the Ivy compiler, set enableIvy to false in tsconfig.app.json, or remove it completely. Also remove "aot": true from your default build options if you didn't have it there before.

Stak
  • 356
  • 2
  • 8
  • 7
    Using Angular 10, a few months after this answer was posted: `Unknown option: 'enableIvy'` god I'm starting to hate angular... – Ben Winding Jul 16 '20 at 08:09
  • 1
    been in angular for 3 years. with the latest version of angular cause lot of headache! – Fai Zal Dong Oct 15 '20 at 10:30
  • 1
    @BenWinding Angular 9 was released on February 6, 2020. Version 9 moves all applications to use the Ivy compiler and runtime by default. source: https://en.wikipedia.org/wiki/Angular_(web_framework) – Tarik Merabet Nov 25 '21 at 11:09