Kendo UI for jQuery使用教程:創建自定義捆綁包
Kendo UI目前最新提供Kendo UI for jQuery、Kendo UI for Angular、Kendo UI Support for React和Kendo UI Support for Vue四個控件。Kendo UI for jQuery是創建現代Web應用程序的最完整UI庫。
根據您的項目,可能需要跳過某些Kendo UI實用程序并僅安裝應用程序所需的內容。
合并腳本
為了促進常見的項目類型,Kendo UI在捆綁包或CDN中提供以下組合腳本:
- kendo.ui.core.min.js包含Kendo UI Core發行版支持的所有小部件,相關腳本也可以在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。 要安裝它,請將kendo.aspnetmvc.min.js添加到kendo.all.min.js,或使用自定義下載構建器工具。
- kendo.web.min.js可用于Kendo UI Professional,JSP,PHP和MVC。 它包括核心框架和所有桌面瀏覽器小部件(以前作為Kendo UI Web分發)。
- kendo.dataviz.min.js可用于Kendo UI Professional,JSP,PHP和MVC。 它包括核心框架和所有數據可視化小部件(以前作為Kendo UI DataViz分發)。
- kendo.mobile.min.js可用于Kendo UI Professional,JSP,PHP和MVC。 它包括核心框架和所有特定于移動設備的小部件(以前作為Kendo UI Mobile分發)。
注意:一次只能包含一個組合的JavaScript文件,因為它們包含Kendo UI框架。 要同時使用來自不同Kendo UI套件的小部件,請使用kendo.all.min.js或構建自定義腳本。
不要將任何組合腳本文件與同一套件中的單個窗口小部件腳本一起注冊。 例如,不要將kendo.grid.js與kendo.web.js或kendo.all.js一起注冊,因為它們已經包含了Grid腳本。
注意:注冊重復腳本可能會導致JavaScript錯誤和意外操作。
個人腳本
以下列表提供了對腳本文件的引用,無論是否縮小,取決于您的項目,都可以包含每個小部件。
自定義腳本
您可以創建僅提供項目所需的小部件和功能的自定義腳本。
使用Download Builder
擁有商業許可證的用戶可以使用自定義Download Builder工具創建單個JavaScript文件,該文件僅包含所需的小部件和功能。
注意:
- 擁有商業許可證的用戶可以使用自定義Download Builder工具創建單個JavaScript文件,該文件僅包含所需的小部件和功能。
- 使用RequireJS無法加載Download Builder軟件包,因為該工具不會創建所需的AMD模塊。
使用Gulp
如果您使用Kendo UI Core軟件包,則可以使用gulp構建工具并按照README文章中的說明構建自定義分發。 截至Kendo UI 2014 Q3版本,必需的構建腳本包含在可下載商業軟件包的src /目錄中。
要從發布源構建自定義分發:
1. 運營以下shell命令。
cd src
npm install -g gulp
npm install
gulp custom -c autocomplete,dropdownlist
2. 列出要包含在自定義構建中的組件,并用逗號(,)分隔它們。 上一個示例構建了一個自定義縮小腳本,其中包括AutoComplete和DropDownList窗口小部件。
3. 通過運行gulp custom -c all構建整個Kendo UI庫。
注意:完成后,gulp命令在src / dist目錄中輸出一個kendo.custom.min.js文件。 Gulp構建任務自動解析每個組件所需的依賴關系,因此您不必列出它們。 不要使用多個自定義組合腳本,因為它們將包含重復的代碼。 而是創建一個組合腳本文件,其中包含您需要的所有內容。
4. 要編譯未縮小的自定義腳本版本,請從gulpfile.js中刪除或注釋掉以下行:
...
.pipe(uglify())
...
標簽順序
要在HTML標記之后加載和執行腳本,請將腳本標記放在結束正文標記之前。 通常,Kendo UI小部件初始化語句通過jQuery處理程序在document.ready事件中執行,這意味著您必須在任何Kendo UI小部件初始化語句之前注冊jQuery。 使用客戶端Kendo UI小部件時,您可以控制初始化語句的位置,以便可以在文檔的底部注冊jQuery腳本文件。
Kendo UI小部件的服務器端包裝器是自我初始化的,這意味著每個初始化腳本都在小部件的HTML標記之后立即呈現。 在這種情況下,Kendo UI腳本仍然可以在文檔的末尾注冊,而jQuery腳本必須在文檔中的第一個Kendo UI小部件之前或文檔頭中注冊到正文中。
掃描關注慧聚IT微信公眾號,及時獲取最新動態及最新資訊
