学习时使用的是VS2017+Core2.1了，不再讨论VS2015和core1.1的东西。

配置ASP.NET Core Web应用程序以使用Telerik UI for ASP.NET Core：

第一步：创建ASP.NET Core Web应用程序。

第二步：添加Kendo UI NuGet包。

因为我们是本地安装，所以建立一个源

默认源路径（以安装路径为准）：C:\Program Files (x86)\Progress\Telerik UI for ASP.NET Core R2 2018\wrappers\aspnetcore\Binaries\AspNet.Core

其实就做了一件事，就是在.csproj  文件中添加了一行引用代码，当然你可以不用以上操作，直接在该文件中添加一下代码也是可以的。

.csproj 文件的打开方法

修改Startup.cs文件

修改ConfigureServices方法

 public void ConfigureServices(IServiceCollection services)

        {

            services.Configure<CookiePolicyOptions>(options =>

            {

                // This lambda determines whether user consent for non-essential cookies is needed for a given request.

                options.CheckConsentNeeded = context => true;

                options.MinimumSameSitePolicy = SameSiteMode.None;

            });

            services.AddMvc().SetCompatibilityVersion(CompatibilityVersion.Version_2_1)

                .AddJsonOptions(options =>

                options.SerializerSettings.ContractResolver = new DefaultContractResolver());

            // Add Kendo UI services to the services container

            services.AddKendo();

        }

需要添加引用：using Newtonsoft.Json.Serialization;

修改Configure方法（这个方法自2018R2开始过时了，可以不用写）

public void Configure(IApplicationBuilder app, IHostingEnvironment env, ILoggerFactory loggerFactory)

{

    ...

    // Configure Kendo UI

    app.UseKendo(env);

}

将 Kendo.Mvc.UI 命名空间导入 文件~/Views/_ViewImports.cshtml ，使用指令：@using Kendo.Mvc.UI.

@using KendoUiTest

@using KendoUiTest.Models

@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers

@addTagHelper *, Kendo.Mvc

@using Kendo.Mvc.UI

复制Kendo UI客户端资源。

手动安装 - 要手动安装资源，请将teles.ui.for.aspnet mvc安装目录中的js和styles 夹复制到wwwroot \ lib \ kendo-ui。

我个人更觉得再加一级版本号目录就好了

方便以后手动升级，毕竟肯定要手动升级，新版本放在新目录里，方便测试回滚吧，比较土的方法。

在〜/ Views / Shared / _Layout.cshtml中注册Kendo UI样式和脚本。

重要说明：在默认的.NET Core模板中，jQuery脚本包含在<body>元素的末尾。 要正确加载ASP.NET HtmlHelpers的Telerik UI，请将jQuery脚本和Kendo UI客户端脚本移动到<head>元素，并确保在jQuery之后加载Kendo UI脚本。

_Layout.cshtml文件

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8" />

    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <title>@ViewData["Title"] - KendoUiTest</title>

    <environment include="Development">

        <link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />

        <link rel="stylesheet" href="~/css/site.css" />

        <link rel="stylesheet" href="~/lib/kendo-ui/2018.2.260/styles/kendo.common-nova.min.css" />

        <link rel="stylesheet" href="~/lib/kendo-ui/2018.2.260/styles/kendo.nova.min.css" />

    </environment>

    <environment exclude="Development">

        <link rel="stylesheet" href="https://ajax.aspnetcdn.com/ajax/bootstrap/3.3.7/css/bootstrap.min.css"

              asp-fallback-href="~/lib/bootstrap/dist/css/bootstrap.min.css"

              asp-fallback-test-class="sr-only" asp-fallback-test-property="position" asp-fallback-test-value="absolute" />

        <link rel="stylesheet" href="~/css/site.min.css" asp-append-version="true" />

        <link rel="stylesheet"

              href="~/lib/kendo-ui/2018.2.260/styles/kendo.common-nova.min.css"

              asp-fallback-href="~/lib/kendo-ui/2018.2.260/styles/kendo.common-nova.min.css"

              asp-fallback-test-class="k-common-test-class"

              asp-fallback-test-property="opacity" asp-fallback-test-value="" />

        <link rel="stylesheet"

              href="~/lib/kendo-ui/2018.2.260/styles/kendo.nova.min.css"

              asp-fallback-href="~/lib/kendo-ui/2018.2.260/styles/kendo.nova.min.css"

              asp-fallback-test-class="k-theme-test-class"

              asp-fallback-test-property="opacity" asp-fallback-test-value="" />

    </environment>

    <environment include="Development">

        <script src="~/lib/jquery/dist/jquery.js"></script>

        @* Place Kendo UI scripts after jQuery *@

        <script src="~/lib/kendo-ui/2018.2.260/js/kendo.all.min.js"></script>

        <script src="~/lib/kendo-ui/2018.2.260/js/kendo.aspnetmvc.min.js"></script>

    </environment>

    <environment exclude="Development">

        ...

        <script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-2.2.0.min.js"

                asp-fallback-src="~/lib/jquery/dist/jquery.min.js"

                asp-fallback-test="window.jQuery"

                crossorigin="anonymous"

                integrity="sha384-K+ctZQ+LL8q6tP7I94W+qzQsfRV2a+AfHIi9k8z8l9ggpc8X+Ytst4yBo/hH+8Fk">

        </script>

        @*  Place Kendo UI scripts after jQuery *@

        <script src="~/lib/kendo-ui/2018.2.260/js/kendo.all.min.js"

                asp-fallback-src="~/lib/kendo-ui/2018.2.260/js/kendo.all.min.js"

                asp-fallback-test="window.kendo">

        </script>

        <script src="~/lib/kendo-ui/2018.2.260/js/kendo.aspnetmvc.min.js"

                asp-fallback-src="~/lib/kendo-ui/2018.2.260/js/kendo.aspnetmvc.min.js"

                asp-fallback-test="kendo.data.transports['aspnetmvc-ajax']">

        </script>

    </environment>

</head>

<body>

        @RenderBody()

    @RenderSection("Scripts", required: false)

</body>

</html>

通过将以下示例中的代码段添加到〜/ Views / Home / Index.cshtml，演示使用Kendo UI DatePicker组件。

Index.cshtml文件（替换掉默认的代码，否则可能导致样式或js不起作用）

@{

    ViewData["Title"] = "Home Page";

}

<h2>Kendo UI DatePicker</h2>

@(Html.Kendo().DatePicker()

      .Name("datepicker")

      )

运行网站，查看效果

测试完成。

关于：Copy Kendo UI Client Resources through NPM and Webpack（通过NPM和Webpack复制Kendo UI客户端资源）

请移步原网站查看：https://docs.telerik.com/aspnet-core/getting-started/getting-started

本文演示如何配置ASP.NET Core项目以在Visual Studio（VS）2017中使用Telerik UI for ASP.NET Core。的更多相关文章

  1. Visual Studio for Mac中的ASP.NET Core

    所以你们都听到了#Build 2017的消息,Mac上的Visual Studio已经被完全发布,是一般的.为了庆祝这个版本,我将在我的Mac上写几篇关于构建一些不同的.net应用的帖子. 正如你已经 ...

  2. 【Asp.Net Core】一、Visual Studio 2015 和 .NET Core 安装

    安装 Visual Studio 和 .NET Core 1.安装 Visual Studio Community 2015,选择 Community 下载并执行默认安装.Visual Studio ...

  3. 006.Adding a controller to a ASP.NET Core MVC app with Visual Studio -- 【在asp.net core mvc 中添加一个控制器】

    Adding a controller to a ASP.NET Core MVC app with Visual Studio 在asp.net core mvc 中添加一个控制器 2017-2-2 ...

  4. Telerik UI for ASP.NET Core概要

    介绍:不介绍了,刚开始研究. 下载:CSDN或者51cto上都有最新的开发版 安装:默认的安装目录是C:\Program Files (x86)\Progress\Telerik UI for ASP ...

  5. Create A .NET Core Development Environment Using Visual Studio Code

    https://www.c-sharpcorner.com/article/create-a-net-core-development-environment-using-visual-studio- ...

  6. 界面开发工具集Telerik UI for ASP.NET AJAX发布R2 2019

    Telerik UI for ASP.NET AJAX拥有构建ASP.NET AJAX和SharePoint应用程序的80+控件,将为任何浏览器和设备构建Web Forms应用程序的时间缩短一半.Te ...

  7. 在Visual Studio 2010/2012中 找不到创建WebService的项目模板

    参考文章: http://blog.sina.com.cn/s/blog_6d545999010152wb.html 在 Visual Studio 2010 或者2012的新建 Web 应用程序或者 ...

  8. Telerik UI for ASP.NET AJAX控件汉化方法

    Telerik UI for ASP.NET AJAX控件功能十分强大,但原版是英文界面的,不方便一些用户使用. 和.NET的其他控件一样,可以通过资源文件来制作多语言版本. 下面看看安装完成后原始的 ...

  9. UI控件Telerik UI for ASP.NET MVC全新发布R2 2019 SP1

    Telerik UI for ASP.NET MVC拥有使用JavaScript和HTML5构建网站和移动应用所需的70+UI部件,来满足开发者的各种需求,提供无语伦比的开发性能和用户体验.它主要是针 ...

随机推荐

  1. LCIS最长公共上升子序列

    最长公共上升子序列LCIS,如字面意思,就是在对于两个数列A和B的最长的单调递增的公共子序列. 这道题目是LCS和LIS的综合. 在LIS中,我们通过两重循环枚举当序列以当前位置为结尾时,A序列中当前 ...

  2. 主席树 STL+二分【p3939】数颜色

    Description 小 C 的兔子不是雪白的,而是五彩缤纷的.每只兔子都有一种颜色,不同的兔子可能有 相同的颜色.小 C 把她标号从 \(1\) 到 \(n\) 的 \(n\) 只兔子排成长长的一 ...

  3. POJ 1236 Network Of Schools (强连通分量缩点求出度为0的和入度为0的分量个数）

    Network of Schools A number of schools are connected to a computer network. Agreements have been dev ...

  4. (转) C#解惑：HashSet<T>类

    HashSet<T>是一个相对“冷门”的类型,平时在项目中用得不多,但是在特定的业务中可以大用. 先来了解下HashSet<T>类,主要被设计用来存储集合,做高性能集运算,例如 ...

  5. 2014 非常好用的开源 Android 测试工具

    http://www.php100.com/html/it/mobile/2014/1015/7495.html 当前有很大的趋势是转向移动应用平台,Android 是最广泛使用的移动操作系统,201 ...

  6. log4j.properties配置详解与实例-全部测试通过

    最近使用log4j写log时候发现网上的写的都是千篇一律,写的好的嘛不全,写的全一点的嘛没有一点格式,看着累.这里把网上收集到的整理了一下,并且全部都在机器上测试成功了.这么好的文档估计没有了吧? # ...

  7. 用Emmet写CSS3属性会自动添加前缀

    CSS3的很多属性都包含浏览器厂商前缀,用Emmet写CSS3属性会自动添加前缀,比如输入trs 会展开为: -webkit-transition: prop time; -moz-transitio ...

  8. Python 的 LEGB 规则（转载）

    转载:https://mp.weixin.qq.com/s?timestamp=1498528588&src=3&ver=1&signature=DfFeOFPXy44ObCM ...

  9. Excel 对应.xml/.ftl 配置（中爆导出范文）

    <?xml version="1.0"?><Workbook xmlns="urn:schemas-microsoft-com:office:sprea ...

  10. webpacke install vue application 报错 Failed at the phantomjs-prebuilt@2.1.14 install script

    刚刚在网上下了个开源的项目: https://github.com/ing670/webappkiller 执行npm install 报错:npm ERR! Failed at the phanto ...