All docs
V24.2
24.2
24.1
23.2
23.1
22.2
22.1
The page you are viewing does not exist in version 22.1.
21.2
The page you are viewing does not exist in version 21.2.
21.1
The page you are viewing does not exist in version 21.1.
20.2
The page you are viewing does not exist in version 20.2.
20.1
The page you are viewing does not exist in version 20.1.
19.2
The page you are viewing does not exist in version 19.2.
19.1
The page you are viewing does not exist in version 19.1.
18.2
The page you are viewing does not exist in version 18.2.
18.1
The page you are viewing does not exist in version 18.1.
17.2
The page you are viewing does not exist in version 17.2.

DevExtreme jQuery/JS - Distribution Channels

npm

You can use npm to deliver DevExtreme to a jQuery application.

Install the latest stable version:

  • npm install devextreme-dist@24.2 --save --save-exact

Install the latest published version. It can be stable or pre-release. Pre-release versions contain hotfixes and new features for early testing.

  • npm install devextreme-dist@24.2-next --save --save-exact
NOTE
We recommend saving an exact version of DevExtreme to avoid unexpected updates because DevExtreme does not use Semantic Versioning. In our versioning system, the first and middle numbers indicate a major release which may contain behavior changes.

Yarn

You can use Yarn to install the DevExtreme npm package.

Install the latest stable version:

  • yarn add devextreme@24.2 --exact

Install the latest published version. It can be stable or pre-release. Pre-release versions contain hotfixes and new features for early testing.

  • yarn add devextreme@24.2-next --exact
NOTE
We recommend saving an exact version of DevExtreme to avoid unexpected updates because DevExtreme does not use Semantic Versioning. In our versioning system, the first and middle numbers indicate a major release which may contain behavior changes.

CDN

DevExtreme sources are available on cdnjs:

Scripts

  • <!-- Diagram and Gantt -->
  • <script src="https://cdnjs.cloudflare.com/ajax/libs/devexpress-diagram/2.2.13/dx-diagram.min.js"></script>
  • <script src="https://cdnjs.cloudflare.com/ajax/libs/devexpress-gantt/4.1.56/dx-gantt.min.js"></script>
  •  
  • <!-- DevExtreme Quill (required by the HtmlEditor UI component) -->
  • <script src="https://cdnjs.cloudflare.com/ajax/libs/devextreme-quill/1.7.1/dx-quill.min.js"></script>
  •  
  • <!-- DevExtreme library -->
  • <script src="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/js/dx.all.js"></script>
  •  
  • <!-- DevExpress.AspNet.Data -->
  • <script src="https://cdnjs.cloudflare.com/ajax/libs/devextreme-aspnet-data/5.0.0/dx.aspnet.data.min.js"></script>
  •  
  • <!-- Development scripts -->
  • <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/devexpress-diagram/2.2.13/dx-diagram.js"></script> -->
  • <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/devexpress-gantt/4.1.56/dx-gantt.js"></script> -->
  • <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/devextreme-quill/1.7.1/dx-quill.js"></script> -->
  • <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/devextreme-aspnet-data/5.0.0/dx.aspnet.data.js"></script> -->

Stylesheets

  • <!-- Diagram and Gantt stylesheets -->
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devexpress-diagram/2.2.13/dx-diagram.min.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devexpress-gantt/4.1.56/dx-gantt.min.css" rel="stylesheet">
  •  
  • <!-- Theme stylesheets (reference only one of them) -->
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.carmine.compact.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.carmine.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.contrast.compact.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.contrast.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.dark.compact.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.dark.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.darkmoon.compact.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.darkmoon.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.darkviolet.compact.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.darkviolet.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.greenmist.compact.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.greenmist.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.light.compact.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.light.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.material.blue.dark.compact.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.material.blue.dark.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.material.blue.light.compact.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.material.blue.light.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.material.lime.dark.compact.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.material.lime.dark.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.material.lime.light.compact.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.material.lime.light.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.material.orange.dark.compact.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.material.orange.dark.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.material.orange.light.compact.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.material.orange.light.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.material.purple.dark.compact.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.material.purple.dark.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.material.purple.light.compact.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.material.purple.light.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.material.teal.dark.compact.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.material.teal.dark.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.material.teal.light.compact.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.material.teal.light.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.softblue.compact.css" rel="stylesheet">
  • <link href="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/24.2.3/css/dx.softblue.css" rel="stylesheet">
  •  
  • <!-- Diagram and Gantt development stylesheets -->
  • <!-- <link href="https://cdnjs.cloudflare.com/ajax/libs/devexpress-diagram/2.2.13/dx-diagram.css" rel="stylesheet"> -->
  • <!-- <link href="https://cdnjs.cloudflare.com/ajax/libs/devexpress-gantt/4.1.56/dx-gantt.css" rel="stylesheet"> -->

Alternatively, you can get DevExtreme sources from DevExpress CDN:

Subresource Integrity Hashes

You can use Subresource Integrity (SRI) hashes to verify DevExtreme files when fetching them from CDN. Each link below contains sha384 and sha512 hashes:

NuGet

When you use Visual Studio, you can get the DevExtreme scripts and stylesheets from the DevExtreme Web NuGet package. Run the following command in the Package Manager Console to install this package:

  • Install-Package DevExtreme.Web -Version 24.2.3

You can also use the Manage NuGet Packages dialog to install or update the package.

See Also

ZIP Archive

Download the ZIP archive if you use jQuery, develop applications with DevExtreme on Mac or Linux, or simply want to try DevExtreme. In this archive you can find DevExtreme scripts, stylesheets, and demos.

NOTE
This archive contains the latest stable version of DevExtreme.

Download ZIP archive

Installer for Windows

The installer for Windows provides Visual Studio integration features, such as project scaffolding. Use it if you develop applications in Visual Studio.

After the installation, you can find the DevExtreme sources in the %ProgramFiles%\DevExpress 24.2\DevExtreme folder.

Download installer for Windows