在捆绑jQuery的CSS，VS2012发布天青404错误 [英] 404 errors on bundled jquery css, VS2012 publishing to Azure

问题描述

我有一个使用jQuery的日期选择器的事情（在常规VS2012 MVC4模板实现）网站。它的外观和本地主机上运行时工作正常。但是，当我发布（天青），部分的CSS缺失。在Chrome开发工具显示404错误两个CSS文件：

I have a web site that uses the jquery datepicker thing (implemented in regular VS2012 MVC4 template). It looks and works fine when running on localhost. But when I publish (to Azure), some of the css is missing. The Chrome dev tools show 404 errors on two css files:

<一个href=\"http://cyclelog.azurewebsites.net/Content/jquery.ui.base.css\">http://cyclelog.azurewebsites.net/Content/jquery.ui.base.css
<一href=\"http://cyclelog.azurewebsites.net/Content/jquery.ui.theme.css\">http://cyclelog.azurewebsites.net/Content/jquery.ui.theme.css

我注意到，有在我的源代码树没有这样的文件 - 而这两个文件都在〜/内容/主题/底座（未直属内容/）。我不知道，使这个原因是什么 - 就像我说的 - CSS的正常工作在本地主机上

I noticed that there are no such files in my source tree--rather the two files are under ~/Content/themes/base (not directly under Content/). I didn't know what to make of this because--like I said--the css works fine on localhost.

在默认的模板创建我没有修改捆绑配置。或者说，我做到了，但只是在努力解决这个问题 - 这没有工作。我恢复了原来的code。在包初始化：

I have not modified the bundling config as created in the default template. Or, rather, I did, but only in an effort to fix the problem--which didn't work. I restored the original code in the bundle initialization:

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"));

任何想法？

推荐答案

问题是〜/内容/主题/基/ jquery.ui.all.css在你的第一个包。此举文件给第二束，它会正常工作。

The problem is the inclusion of "~/Content/themes/base/jquery.ui.all.css" in your first bundle. Move that file to the second bundle and it will work.

它的工作原理，因为本地本地，捆绑不会发生（假设你是在调试模式下）。该文件中的@import工作，因为它是（/内容/主题/基/）寻找正确的目录，因为链接呈现为：

It works locally because locally, bundling doesn't occur (assuming you are in debug mode). The @import in that file works because it is looking in the correct directory ("/Content/themes/base/"), since the link is rendered as:

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

在此部署，该文件被捆绑成〜/内容/ CSS 。样式表绑定，现在呈现为：

When you deploy this, that file gets bundled into ~/Content/css. The style sheet is bundled and now is rendered as:

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

所以，现在两个@import声明失败，因为这两个文件并不在该目录中。

So now the two @import statements fail since the two files do not exist in that directory.

但是，它们在存在〜/内容/主题/基/这就是为什么它会在第二束，当一切都在释放模式被捆绑的工作。

However, they do exist in "~/Content/themes/base/" which is why it will work in the 2nd bundle, when everything gets bundled in release mode.

与信息更多阅读你如何可以在本地复制此问题：<一href=\"http://stackoverflow.com/questions/14570171/scripts-render-using-outdated-javascript-file/14570455#14570455\">Scripts.Render使用过时的JavaScript文件

More reading with info on how you can replicate this issue locally: Scripts.Render using outdated javascript file

这篇关于在捆绑jQuery的CSS，VS2012发布天青404错误的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！