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微信公众号,及时获取最新动态及最新资讯