捆绑CSS链接得到一个404错误 [英] Bundled css link gets a 404 error

问题描述

我想获得捆绑在ASP.NET MVC 4.工作我正在从捆绑的CSS生成的链接404错误。我也做了以下内容：

1. 通过的NuGet安装了微软的ASP.NET Web优化框架包（v4.0.20710.0）




2. 创建一个BundleConfig类的App_Start目录包含以下内容：

    使用System.Web.Optimization;
   命名空间BsdAppTemplate.Web_Nancy.App_Start
   {
       公共类BundleConfig
       {
           公共静态无效RegisterBundles（BundleCollection包）
           {
               bundles.Add（新StyleBundle（〜/包/风格/ CVI）。包括（
                   〜/ mainstyles.css
               ））;
           }
       }
   }
    




3. 增加了以下到Web.config文件在网站根目录：

    ＆LT;＆的System.Web GT;
       ＆LT;编译调试=假targetFramework =4.5/＆GT;    ＆LT;网页和GT;
         ＆LT;＆命名空间GT;
           ＆LT;添加命名空间=System.Web.Optimization/＆GT;
           ...
         ＆LT; /命名空间＆GT;
       ＆LT; /页＆GT;
   ＆LT; /system.web>
    




4. 增加了以下到我的MVC布局文件的头部元素：

     @ Styles.Render（〜/包/风格/ CVI）
    




5. 在复制引用BundleConfig CSS文件（mainstyles.css）到我的Web项目的根目录。

当我查看渲染文件的来源，我可以看到该链接显示为：

 ＆LT;链接HREF =/包/风格/ CVI的rel =stylesheet属性/＆GT;
 

该浏览到它的时候，或查看在Chrome的网络选项卡页面请求。链接结果在404

我也尝试在Web表单上等价的，但我从生成的链接相同的结果（404），当我补充一下：

 ＆LT;％：Styles.Render（〜/包/风格/ CVI）％＆GT;
 

解决方案

看来你已经错过了你调用 RegisterBundles 在应用配置步骤的Application_Start ：

 保护无效的Application_Start（）
{
    ...
    BundleConfig.RegisterBundles（BundleTable.Bundles）;
    ...
}
 

通常在其中 BundleConfig 类是已经存在（无论是作为项目模板的一部分，或者在安装过程中的NuGet包创建）这一呼吁也已经$病例p $ psent - 这就是为什么很多教程是隐含它

您也应该知道，在 BundleConfig 类是有关注点的分离，为了保持的Application_Start 干净。在简单情况下没什么$ P $直接在登记束pvents您的Application_Start ：

 保护无效的Application_Start（）
{
    ...
    BundleTable.Bundles.Add（新StyleBundle（〜/包/风格/ CVI），包括（〜/ mainstyles.css））;    ...
}
 

I am trying to get bundling to work in ASP.NET MVC 4. I am getting a 404 error from the link generated for the bundled CSS. I have done the following:

1. Installed the "Microsoft ASP.NET Web Optimization Framework" package via NuGet (v4.0.20710.0)

2. Created a BundleConfig class in the App_Start dir with the following contents:

   using System.Web.Optimization;
   namespace BsdAppTemplate.Web_Nancy.App_Start
   {
       public class BundleConfig
       {
           public static void RegisterBundles(BundleCollection bundles)
           {
               bundles.Add(new StyleBundle("~/bundles/styles/cvi").Include(
                   "~/mainstyles.css"
               ));
           }
       }
   }
   

3. Added the following to Web.config at site root:

   <system.web>
       <compilation debug="false" targetFramework="4.5" />
   
       <pages>
         <namespaces>
           <add namespace="System.Web.Optimization"/>
           ...
         </namespaces>
       </pages>
   </system.web>
   

4. Added the following to the head element of my MVC layout file:

    @Styles.Render("~/bundles/styles/cvi")
   

5. Copied the CSS file referenced in BundleConfig ("mainstyles.css") into the root directory of my web project.

When I view the source of a rendered file, I can see the link appears as:

<link href="/bundles/styles/cvi" rel="stylesheet"/>

This link results in a 404 when browsing to it, or viewing the page request in Chrome's network tab.

I have also tried the equivalent on a web form, but I get the same result (404) from the link generated when I add:

<%: Styles.Render("~/bundles/styles/cvi") %>

解决方案

It seems that you have missed the step in which you apply your configuration by calling RegisterBundles in Application_Start:

protected void Application_Start()
{
    ...
    BundleConfig.RegisterBundles(BundleTable.Bundles);
    ...
}

Usually in cases where the BundleConfig class is already there (either as a part of the project template or created by NuGet package during the installation) this call is also already present - this is why many tutorials are implicit about it.

You should also be aware that the BundleConfig class is there for separation of concerns and in order to keep the Application_Start clean. In simple cases nothing prevents you from registering bundles directly in Application_Start:

protected void Application_Start()
{
    ...
    BundleTable.Bundles.Add(new StyleBundle("~/bundles/styles/cvi").Include("~/mainstyles.css"));

    ...
}

这篇关于捆绑CSS链接得到一个404错误的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！