Question

我有一个使用jquery datepicker的网站（在常规的VS2012 MVC4模板中实现）。它在localhost上运行时看起来很好。但是当我发布（到Azure）时，一些css丢失了。 Chrome开发工具在两个css文件中显示404错误：

http://cyclelog.azurewebsites.net/Content/jquery.ui.base.css http://cyclelog.azurewebsites.net/Content/jquery.ui.theme.css

我注意到源树中没有这样的文件 - 而是两个文件在〜/ Content / themes / base下（不是直接在Content /下）。我不知道该怎么做，因为 - 就像我说的那样 - css在localhost上运行正常。

我没有修改默认模板中创建的捆绑配置。或者，相反，我做了，但只是为了解决问题 - 这不起作用。我在捆绑初始化中恢复了原始代码：

bundles.Add(new StyleBundle("~/Content/css").Include(
            "~/Content/site.css",                
            "~/Content/themes/base/jquery.ui.all.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"));

有什么想法吗？

Answer 1

问题是在您的第一个捆绑包中包含"~/Content/themes/base/jquery.ui.all.css"。将该文件移动到第二个包，它将起作用。

它在本地工作，因为在本地，不会发生捆绑（假设您处于调试模式）。该文件中的@import有效，因为它正在查找正确的目录（"/Content/themes/base/"），因为链接呈现为：

<link href="/Content/themes/base/jquery.ui.all.css" rel="stylesheet"/>

部署此文件时，该文件将捆绑到~/Content/css。样式表是捆绑的，现在呈现为：

<link href="/Content/css?v=IqLBj6MTQkC-CU1" rel="stylesheet"/>

所以现在两个@import语句都失败了，因为该目录中不存在这两个文件。

但是，它们确实存在于"~/Content/themes/base/"中，这就是为什么它将在第二个包中工作，当所有内容在发布模式下捆绑在一起时。

有关如何在本地复制此问题的信息的更多阅读：Scripts.Render using outdated javascript file

捆绑的jquery css上的404错误，VS2012发布到Azure

1 个答案: