ASP.NET MVC 5无法呈现jQuery UI CSS包

Question

ASP.NET MVC 5无法呈现jQuery UI CSS包

Mar*_*man 7 css asp.net-mvc jquery jquery-ui

我想在我的项目中包含jQuery UI CSS主题包.我在我的~/Content/themes目录中有所有必需的文件,并设置BundleConfig.cs如下:

public class BundleConfig
{
    // For more information on bundling, visit http://go.microsoft.com/fwlink/?LinkId=301862
    public static void RegisterBundles(BundleCollection bundles)
    {
        bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                    "~/Scripts/jquery-{version}.js"));

        bundles.Add(new ScriptBundle("~/bundles/jqueryui").Include(
        "~/Scripts/jquery-ui-{version}.js"));

        bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                    "~/Scripts/jquery.validate*"));

        // Use the development version of Modernizr to develop with and learn from. Then, when you're
        // ready for production, use the build tool at http://modernizr.com to pick only the tests you need.
        bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
                    "~/Scripts/modernizr-*"));

        bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
                  "~/Scripts/bootstrap.js",
                  "~/Scripts/respond.js"));

        bundles.Add(new StyleBundle("~/Content/css").Include(
                  "~/Content/bootstrap.css",
                  "~/Content/site.css"));

        bundles.Add(new StyleBundle("~/Content/themes/base/css").Include(
          "~/Content/themes/base/jquery.ui.core.css",
          "~/Content/themes/base/jquery.ui.resizable.css",
          "~/Content/themes/base/jquery.ui.selectable.css",
          "~/Content/themes/base/jquery.ui.accordion.css",
          "~/Content/themes/base/jquery.ui.autocomplete.css",
          "~/Content/themes/base/jquery.ui.button.css",
          "~/Content/themes/base/jquery.ui.dialog.css",
          "~/Content/themes/base/jquery.ui.slider.css",
          "~/Content/themes/base/jquery.ui.tabs.css",
          "~/Content/themes/base/jquery.ui.datepicker.css",
          "~/Content/themes/base/jquery.ui.progressbar.css",
          "~/Content/themes/base/jquery.ui.theme.css"));            
    }
}

Run Code Online (Sandbox Code Playgroud)

我_Layout.cshtml有以下几点<head>:

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@ViewBag.Title</title>
    <link href="//fonts.googleapis.com/css?family=Open+Sans:300,400" rel="stylesheet" type="text/css">
    @Styles.Render("~/Content/themes/base/css", "~/Content/css", "~/Content/datepicker3.css")
    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/jqueryui")
    @Scripts.Render("~/bundles/bootstrap")
    @Scripts.Render("~/bundles/modernizr")
    @Scripts.Render("~/Content/bootstrap-datepicker.js")
    @RenderSection("head", required: false)
    <link rel="icon" href="@Url.Content("~/Content/favicon.ico")" />
</head>

Run Code Online (Sandbox Code Playgroud)

但是,这是发出的HTML(注意缺少jQuery CSS主题):

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title></title>
    <link href="//fonts.googleapis.com/css?family=Open+Sans:300,400" rel="stylesheet" type="text/css">
    <link href="/PackageManager/Content/bootstrap.css" rel="stylesheet"/>
    <link href="/PackageManager/Content/site.css" rel="stylesheet"/>
    <link href="/PackageManager/Content/datepicker3.css" rel="stylesheet"/>
    <script src="/PackageManager/Scripts/jquery-1.10.2.js"></script>
    <script src="/PackageManager/Scripts/jquery-ui-1.11.3.js"></script>
    <script src="/PackageManager/Scripts/bootstrap.js"></script>
    <script src="/PackageManager/Scripts/respond.js"></script>
    <script src="/PackageManager/Scripts/modernizr-2.6.2.js"></script>
    <script src="/PackageManager/Content/bootstrap-datepicker.js"></script>    
    <link rel="icon" href="/PackageManager/Content/favicon.ico" />
</head>

Run Code Online (Sandbox Code Playgroud)

这是我的解决方案结构:

在此输入图像描述

我错过了什么？

Answer 1

Sam*_*Sam 24

除非我遗漏了某些东西,否则你的文件看起来都不是前缀jquery.ui.,而是你的文件BundleConfig.

例如,您正在使用jquery.ui.core.css的BundleConfig,但在你的Solution Explorer中的文件被命名为core.css.

归档时间：	10 年，8 月前
查看次数：	7338 次
最近记录：	10 年，8 月前