Installation of Syncfusion Controls

4 Apr 20231 minute to read

Install by using NPM CLI

Syncfusion packages are distributed in npm as @syncfusion scoped packages. You can get all the Angular Syncfusion package from npm.

Currently, Syncfusion provides two types of package structures for Angular components,

  1. Ivy library distribution package format
  2. Angular compatibility compiler (Angular’s legacy compilation and rendering pipeline) package.

Ivy Library Distribution Package

By default, Syncfusion Angular packages(>=20.2.36) supports Angular Ivy distribution. The package are compatible with Angular version 12 and above. To install the package use the below command,

Add @syncfusion/ej2-angular-grids package to the application.

npm install @syncfusion/ej2-angular-grids --save

Angular compatibility compiled package (ngcc)

For Angular version below 12, you can use the ngcc tagged packages of the Syncfusion Angular components. To install the package use the below command,

Add @syncfusion/ej2-angular-grids@ngcc package to the application.

npm install @syncfusion/ej2-angular-grids@ngcc --save

To mention the ngcc package in the package.json file, add the suffix -ngcc with the package version as below.

@syncfusion/ej2-angular-grids:"20.2.38-ngcc"

If the ngcc tag is not specified while installing the package for Angular versions below 12, the Ivy package will be installed with warning.

Install by using package.json

  1. Add the Syncfusion Angular (Essential JS 2) package references in the dependencies of ~/package.json file.

     {
         "dependencies": {
             "@syncfusion/ej2-angular-grids": "*",
             "@syncfusion/ej2-angular-charts": "*"
         }
     }

    The * indicates the latest version of npm package. Refer the documentation for more details about npm versioning.

  2. Now, open the command prompt and run the npm install command line. This will install all npm dependencies in a single command line.

    Refer the documentation for more details about npm package.json