Setting Up the License File
Using any Kendo UI for jQuery scripts that are installed through NPM or imported through the Kendo UI CDN requires you to provide a license file. Follow the steps in this article to download a license file, add it to your application, and then reference it.
Providing a license file is not required when using distribution methods such as NuGet, Bower, and locally downloaded Kendo UI commercial bundles.
A missing license file causes a banner, a watermark, and a message in the browser's console to appear:
Example of a watermark in the Light Theme
Example of a watermark in the Dark Theme
A banner on pages that use unlicensed Kendo UI for jQuery components
A message in the browser's console
To add a Kendo UI license file to your application:
- Download a license file.
- Add the license file in your application.
- Add a reference or import the license file.
1. Get a License File
This section contains auto-generated content based on the license information for your account.
To acquire a license file, generate it.
If you experience any issues related to the license key, contact us through the available support channels.
2. Add the License File
Place the kendo-ui-license.js file in the root of the application or in the main scripts folder.
The following table shows the most common location you can include it according to the type of the application.
| Type of Application | Common Locations |
|---|---|
| JS (JavaScript) applications |
|
| ASP.NET MVC applications |
|
| ASP.NET Core applications |
|
3. Add a Reference or Import the License File
You can reference the kendo-ui-license.js file by using either of the following approaches:
As a result, the license key will be distributed along with the scripts and this cannot be avoided. However, Progress recommends that you do not publicly announce it.
Use a Script Reference
Add the kendo-ui-license.js as a script reference right after the kendo.all.min.js reference or the Kendo UI scripts you are using.
The following example shows how to use the CDN reference (kendo.all.min.js).
<script src="https://kendo.cdn.telerik.com/***/kendo.all.min.js"></script>
<script src="./kendo-ui-license.js"></script>
<!-- Rest of the HTML -->
The following example shows how to use the CDN reference by utilizing the predefined list of scripts.
<script src="https://kendo.cdn.telerik.com/***/kendo.core.min.js"></script>
<script src="https://kendo.cdn.telerik.com/***/kendo.userevents.min.js"></script>
<script src="https://kendo.cdn.telerik.com/***/kendo.draganddrop.min.js"></script>
<script src="https://kendo.cdn.telerik.com/***/kendo.popup.min.js "></script>
<script src="https://kendo.cdn.telerik.com/***/kendo.fx.min.js"></script>
<script src="https://kendo.cdn.telerik.com/***/kendo.window.min.js"></script>
<script src="./kendo-ui-license.js"></script>
<!-- Rest of the HTML -->
In case you are using ECMAScript modules to load the Kendo files you need to add type='module' on the license script reference.
<script src="https://kendo.cdn.telerik.com/***/kendo.all.min.js" type="module"></script>
<script src="./kendo-ui-license.js" type="module"></script>
<!-- Rest of the HTML -->
Use JS or TS Modules
Import the kendo-ui-license.js file right after the import of the Kendo UI modules.
The following example shows how to use the ESM (ECMAScript) modules.
import "@progress/kendo-ui";
import "./kendo-ui-license.js";
$("#grid").kendoGrid();
The following example shows how to use the CJS (CommonJS) modules.
require("@progress/kendo-ui");
require("./kendo-ui-license.js");
$("#grid").kendoGrid();
Often, you will need two or more imports of the Kendo UI libraries and you will need to import the license file only in one location, which most likely will be the main script file of your application. In that case, import the kendo.core.js and register your license code as usual.
The following example shows how to use the ESM (ECMAScript) modules to import the license file in a single location.
import '@progress/kendo-ui/js/kendo.core';
import './kendo-ui-license.js';
// The rest of the code.
The following example shows how to use the CJS (CommonJS) modules to import the license files in a single location.
require("@progress/kendo-ui/js/kendo.core");
require("./kendo-ui-license.js");
// The rest of the code.