捆绑的 css 链接出现 404 错误 [英] Bundled css link gets a 404 error

问题描述

我正在尝试让捆绑在 ASP.NET MVC 4 中工作.我从为捆绑的 CSS 生成的链接中收到 404 错误.我做了以下事情:

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. 通过 NuGet (v4.0.20710.0) 安装了Microsoft ASP.NET Web Optimization Framework"包

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

在 App_Start 目录中创建了一个 BundleConfig 类，内容如下:

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

在站点根目录的 Web.config 中添加了以下内容:

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>

将以下内容添加到我的 MVC 布局文件的 head 元素中:

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

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

将 BundleConfig 中引用的 CSS 文件(mainstyles.css")复制到我的 web 项目的根目录中.

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"/>

浏览此链接或在 Chrome 的网络选项卡中查看页面请求时会导致 404.

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

我也在网络表单上尝试过类似的方法，但我从添加时生成的链接中得到了相同的结果 (404):

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

推荐答案

您似乎错过了通过在 Application_Start 中调用 RegisterBundles 来应用配置的步骤:

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);
    ...
}

通常在 BundleConfig 类已经存在的情况下(作为项目模板的一部分或在安装过程中由 NuGet 包创建)这个调用也已经存在 - 这就是许多教程的原因是隐含的.

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.

您还应该知道 BundleConfig 类用于分离关注点并保持 Application_Start 干净.在简单的情况下，没有什么可以阻止您直接在 Application_Start 中注册包:

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屋！