Kendo UI for jQuery使用教程：創(chuàng)建自定義捆綁包

【Kendo UI for jQuery最新試用版下載】

Kendo UI目前最新提供Kendo UI for jQuery、Kendo UI for Angular、Kendo UI Support for React和Kendo UI Support for Vue四個(gè)控件。Kendo UI for jQuery是創(chuàng)建現(xiàn)代Web應(yīng)用程序的最完整UI庫(kù)。

根據(jù)您的項(xiàng)目，可能需要跳過(guò)某些Kendo UI實(shí)用程序并僅安裝應(yīng)用程序所需的內(nèi)容。

合并腳本

為了促進(jìn)常見(jiàn)的項(xiàng)目類(lèi)型，Kendo UI在捆綁包或CDN中提供以下組合腳本：

• kendo.ui.core.min.js包含Kendo UI Core發(fā)行版支持的所有小部件，相關(guān)腳本也可以在Kendo UI Core包中找到。
• kendo.all.min.js包含Kendo UI提供的所有功能的縮小版本。

注意：kendo.all.min.js可用于Kendo UI Professional，Telerik UI for ASP.NET MVC，Telerik UI for JSP和Telerik UI for PHP bundle。 但是，kendo.all.min.js不包含kendo.aspnetmvc.min.js。 要安裝它，請(qǐng)將kendo.aspnetmvc.min.js添加到kendo.all.min.js，或使用自定義下載構(gòu)建器工具。

• kendo.web.min.js可用于Kendo UI Professional，JSP，PHP和MVC。 它包括核心框架和所有桌面瀏覽器小部件（以前作為Kendo UI Web分發(fā)）。
• kendo.dataviz.min.js可用于Kendo UI Professional，JSP，PHP和MVC。 它包括核心框架和所有數(shù)據(jù)可視化小部件（以前作為Kendo UI DataViz分發(fā)）。
• kendo.mobile.min.js可用于Kendo UI Professional，JSP，PHP和MVC。 它包括核心框架和所有特定于移動(dòng)設(shè)備的小部件（以前作為Kendo UI Mobile分發(fā)）。

注意：一次只能包含一個(gè)組合的JavaScript文件，因?yàn)樗?們包含Kendo UI框架。 要同時(shí)使用來(lái)自不同Kendo UI套件的小部件，請(qǐng)使用kendo.all.min.js或構(gòu)建自定義腳本。

不要將任何組合腳本文件與同一套件中的單個(gè)窗口小部件腳本一起注冊(cè)。 例如，不要將kendo.grid.js與kendo.web.js或kendo.all.js一起注冊(cè)，因?yàn)樗鼈円呀?jīng)包含了Grid腳本。

注意：注冊(cè)重復(fù)腳本可能會(huì)導(dǎo)致JavaScript錯(cuò)誤和意外操作。

個(gè)人腳本

以下列表提供了對(duì)腳本文件的引用，無(wú)論是否縮小，取決于您的項(xiàng)目，都可以包含每個(gè)小部件。

自定義腳本

您可以創(chuàng)建僅提供項(xiàng)目所需的小部件和功能的自定義腳本。

使用Download Builder

擁有商業(yè)許可證的用戶(hù)可以使用自定義Download Builder工具創(chuàng)建單個(gè)JavaScript文件，該文件僅包含所需的小部件和功能。

注意：

• 擁有商業(yè)許可證的用戶(hù)可以使用自定義Download Builder工具創(chuàng)建單個(gè)JavaScript文件，該文件僅包含所需的小部件和功能。
• 使用RequireJS無(wú)法加載Download Builder軟件包，因?yàn)樵摴ぞ卟粫?huì)創(chuàng)建所需的AMD模塊。

使用Gulp

如果您使用Kendo UI Core軟件包，則可以使用gulp構(gòu)建工具并按照README文章中的說(shuō)明構(gòu)建自定義分發(fā)。 截至Kendo UI 2014 Q3版本，必需的構(gòu)建腳本包含在可下載商業(yè)軟件包的src /目錄中。

要從發(fā)布源構(gòu)建自定義分發(fā)：

1. 運(yùn)營(yíng)以下shell命令。

cd src
npm install -g gulp
npm install
gulp custom -c autocomplete,dropdownlist

2. 列出要包含在自定義構(gòu)建中的組件，并用逗號(hào)（，）分隔它們。 上一個(gè)示例構(gòu)建了一個(gè)自定義縮小腳本，其中包括AutoComplete和DropDownList窗口小部件。

3. 通過(guò)運(yùn)行g(shù)ulp custom -c all構(gòu)建整個(gè)Kendo UI庫(kù)。

注意：完成后，gulp命令在src / dist目錄中輸出一個(gè)kendo.custom.min.js文件。 Gulp構(gòu)建任務(wù)自動(dòng)解析每個(gè)組件所需的依賴(lài)關(guān)系，因此您不必列出它們。 不要使用多個(gè)自定義組合腳本，因?yàn)樗鼈儗貜?fù)的代碼。 而是創(chuàng)建一個(gè)組合腳本文件，其中包含您需要的所有內(nèi)容。

4. 要編譯未縮小的自定義腳本版本，請(qǐng)從gulpfile.js中刪除或注釋掉以下行：

...
.pipe(uglify())
...

標(biāo)簽順序

要在HTML標(biāo)記之后加載和執(zhí)行腳本，請(qǐng)將腳本標(biāo)記放在結(jié)束正文標(biāo)記之前。 通常，Kendo UI小部件初始化語(yǔ)句通過(guò)jQuery處理程序在document.ready事件中執(zhí)行，這意味著您必須在任何Kendo UI小部件初始化語(yǔ)句之前注冊(cè)jQuery。 使用客戶(hù)端Kendo UI小部件時(shí)，您可以控制初始化語(yǔ)句的位置，以便可以在文檔的底部注冊(cè)jQuery腳本文件。

Kendo UI小部件的服務(wù)器端包裝器是自我初始化的，這意味著每個(gè)初始化腳本都在小部件的HTML標(biāo)記之后立即呈現(xiàn)。 在這種情況下，Kendo UI腳本仍然可以在文檔的末尾注冊(cè)，而jQuery腳本必須在文檔中的第一個(gè)Kendo UI小部件之前或文檔頭中注冊(cè)到正文中。

掃描關(guān)注慧聚IT微信公眾號(hào)，及時(shí)獲取最新動(dòng)態(tài)及最新資訊