Asp.net mvc 4 ASP.NET优化-捆绑

我一直在尝试ASP.NET MVC 4中新的缩小和绑定功能，只要您使用css和js文件的默认文件夹约定，它就非常有效

/Content
/Scripts

我通常将css和脚本放在一个名为Static的文件夹中，如下所示

/Static/Css
/Static/Js

我尝试像这样注册我自己的捆绑包：

public static class BundleCollectionExtensions
{
    public static void RegisterScriptsAndCss(this BundleCollection bundles)
    {
        var bootstrapCss = new Bundle("~/Static/Css", new CssMinify());
        bootstrapCss.AddDirectory("~/Static/Css", "*.css");
        bootstrapCss.AddFile("~/Static/Css/MvcValidation.css");
        bootstrapCss.AddFile("~/Static/Css/bootstrap-responsive.min.css");
        bootstrapCss.AddFile("~/Static/Css/bootstrap.min.css");

        bundles.Add(bootstrapCss);

        var bootstrapJs = new Bundle("~/Static/Js", new JsMinify());
        bootstrapJs.AddDirectory("~/Static/Js", "*.js");
        bootstrapJs.AddFile("~/Static/Js/jquery-1.7.1.min.js");
        bootstrapJs.AddFile("~/Static/Js/jquery.validate.min.js");
        bootstrapJs.AddFile("~/Static/Js/jquery.validate.unobtrusive.min.js");
        bootstrapJs.AddFile("~/Static/Js/bootstrap.min.js");
        bootstrapJs.AddFile("~/Static/Js/gunsforhire.js");

        bundles.Add(bootstrapJs);
    }
}

<link href="/Static/Css?v=D9JdmLZFFwjRwraNKfA1uei_YMoBoqLf-gFc0zHivM41" rel="stylesheet" type="text/css" />

<script src="/Static/Js?v=mbKbf5__802kj-2LS5j9Ba-wvSxBCKNMQGBgzou6iZs1" type="text/javascript"></script>

Request URL:http://localhost:49603/Static/Js?v=mbKbf5__802kj-2LS5j9Ba-wvSxBCKNMQGBgzou6iZs1
Request Method:GET
Status Code:301 Moved Permanently (from cache)
Query String Parametersview URL encoded
v:mbKbf5__802kj-2LS5j9Ba-wvSxBCKNMQGBgzou6iZs1

Request URL:http://localhost:49603/Static/Js/?v=mbKbf5__802kj-2LS5j9Ba-wvSxBCKNMQGBgzou6iZs1
Request Method:GET
Status Code:404 Not Found
Request Headersview source
Accept:*/*
Accept-Charset:ISO-8859-1,utf-8;q=0.7,*;q=0.3
Accept-Encoding:gzip,deflate,sdch
Accept-Language:en-US,en;q=0.8
Connection:keep-alive
Host:localhost:49603
Referer:http://localhost:49603/
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/535.11 (KHTML, like Gecko)        Chrome/17.0.963.56 Safari/535.11
Query String Parametersview URL encoded
v:mbKbf5__802kj-2LS5j9Ba-wvSxBCKNMQGBgzou6iZs1
Response Headersview source
Cache-Control:private
Content-Length:4757
Content-Type:text/html; charset=utf-8
Date:Thu, 01 Mar 2012 19:05:44 GMT
Server:Microsoft-IIS/7.5
X-Powered-By:ASP.NET
X-SourceFiles:=?UTF-8?B?   QzpcQENvZGVccGVsbGVccGVsbGVoZW5yaWtzc29uLnNlXHNyY1xXZWJcU3RhdGljXEpzXA==?=

public static void Initializing()
{
   IBundleTransform jstransformer;
   IBundleTransform csstransformer;

#if DEBUG
            jstransformer = new NoTransform("text/javascript");
            csstransformer = new NoTransform("text/css");
#else
      jstransformer = new JsMinify();
      csstransformer = new CssMinify();
#endif

            var bundle = new Bundle("~/Scripts/js", jstransformer);

            bundle.AddFile("~/Scripts/jquery-1.6.2.js", true);
            bundle.AddFile("~/Scripts/jquery-ui-1.8.11.js", true);
            bundle.AddFile("~/Scripts/jquery.validate.unobtrusive.js", true);
            bundle.AddFile("~/Scripts/jquery.unobtrusive-ajax.js", true);
            bundle.AddFile("~/Scripts/jquery.validate.js", true);
            bundle.AddFile("~/Scripts/modernizr-2.0.6-development-only.js", true);
            bundle.AddFile("~/Scripts/AjaxLogin.js", true);
            bundle.AddFile("~/Scripts/knockout-2.0.0.debug.js", true);
            bundle.AddFile("~/Scripts/bootstrap.js", true);
            bundle.AddFile("~/Scripts/dungeon.custom.js", true);

            BundleTable.Bundles.Add(bundle);

            bundle = new Bundle("~/Content/css", csstransformer);

            bundle.AddFile("~/Content/bootstrap-responsive.css", true);
            bundle.AddFile("~/Content/bootstrap.css", true);

            BundleTable.Bundles.Add(bundle);

            bundle = new Bundle("~/Content/themes/base/css", csstransformer);

            bundle.AddFile("~/Content/themes/base/jquery.ui.core.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.resizable.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.selectable.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.accordion.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.autocomplete.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.button.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.dialog.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.slider.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.tabs.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.datepicker.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.progressbar.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.theme.css", true);

            BundleTable.Bundles.Add(bundle);
        }

而且

Global.ascx.cs

我这样做：

BundleTable.Bundles.RegisterScriptsAndCss();

生成的标记如下所示：

public static class BundleCollectionExtensions
{
    public static void RegisterScriptsAndCss(this BundleCollection bundles)
    {
        var bootstrapCss = new Bundle("~/Static/Css", new CssMinify());
        bootstrapCss.AddDirectory("~/Static/Css", "*.css");
        bootstrapCss.AddFile("~/Static/Css/MvcValidation.css");
        bootstrapCss.AddFile("~/Static/Css/bootstrap-responsive.min.css");
        bootstrapCss.AddFile("~/Static/Css/bootstrap.min.css");

        bundles.Add(bootstrapCss);

        var bootstrapJs = new Bundle("~/Static/Js", new JsMinify());
        bootstrapJs.AddDirectory("~/Static/Js", "*.js");
        bootstrapJs.AddFile("~/Static/Js/jquery-1.7.1.min.js");
        bootstrapJs.AddFile("~/Static/Js/jquery.validate.min.js");
        bootstrapJs.AddFile("~/Static/Js/jquery.validate.unobtrusive.min.js");
        bootstrapJs.AddFile("~/Static/Js/bootstrap.min.js");
        bootstrapJs.AddFile("~/Static/Js/gunsforhire.js");

        bundles.Add(bootstrapJs);
    }
}

<link href="/Static/Css?v=D9JdmLZFFwjRwraNKfA1uei_YMoBoqLf-gFc0zHivM41" rel="stylesheet" type="text/css" />

<script src="/Static/Js?v=mbKbf5__802kj-2LS5j9Ba-wvSxBCKNMQGBgzou6iZs1" type="text/javascript"></script>

Request URL:http://localhost:49603/Static/Js?v=mbKbf5__802kj-2LS5j9Ba-wvSxBCKNMQGBgzou6iZs1
Request Method:GET
Status Code:301 Moved Permanently (from cache)
Query String Parametersview URL encoded
v:mbKbf5__802kj-2LS5j9Ba-wvSxBCKNMQGBgzou6iZs1

Request URL:http://localhost:49603/Static/Js/?v=mbKbf5__802kj-2LS5j9Ba-wvSxBCKNMQGBgzou6iZs1
Request Method:GET
Status Code:404 Not Found
Request Headersview source
Accept:*/*
Accept-Charset:ISO-8859-1,utf-8;q=0.7,*;q=0.3
Accept-Encoding:gzip,deflate,sdch
Accept-Language:en-US,en;q=0.8
Connection:keep-alive
Host:localhost:49603
Referer:http://localhost:49603/
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/535.11 (KHTML, like Gecko)        Chrome/17.0.963.56 Safari/535.11
Query String Parametersview URL encoded
v:mbKbf5__802kj-2LS5j9Ba-wvSxBCKNMQGBgzou6iZs1
Response Headersview source
Cache-Control:private
Content-Length:4757
Content-Type:text/html; charset=utf-8
Date:Thu, 01 Mar 2012 19:05:44 GMT
Server:Microsoft-IIS/7.5
X-Powered-By:ASP.NET
X-SourceFiles:=?UTF-8?B?   QzpcQENvZGVccGVsbGVccGVsbGVoZW5yaWtzc29uLnNlXHNyY1xXZWJcU3RhdGljXEpzXA==?=

public static void Initializing()
{
   IBundleTransform jstransformer;
   IBundleTransform csstransformer;

#if DEBUG
            jstransformer = new NoTransform("text/javascript");
            csstransformer = new NoTransform("text/css");
#else
      jstransformer = new JsMinify();
      csstransformer = new CssMinify();
#endif

            var bundle = new Bundle("~/Scripts/js", jstransformer);

            bundle.AddFile("~/Scripts/jquery-1.6.2.js", true);
            bundle.AddFile("~/Scripts/jquery-ui-1.8.11.js", true);
            bundle.AddFile("~/Scripts/jquery.validate.unobtrusive.js", true);
            bundle.AddFile("~/Scripts/jquery.unobtrusive-ajax.js", true);
            bundle.AddFile("~/Scripts/jquery.validate.js", true);
            bundle.AddFile("~/Scripts/modernizr-2.0.6-development-only.js", true);
            bundle.AddFile("~/Scripts/AjaxLogin.js", true);
            bundle.AddFile("~/Scripts/knockout-2.0.0.debug.js", true);
            bundle.AddFile("~/Scripts/bootstrap.js", true);
            bundle.AddFile("~/Scripts/dungeon.custom.js", true);

            BundleTable.Bundles.Add(bundle);

            bundle = new Bundle("~/Content/css", csstransformer);

            bundle.AddFile("~/Content/bootstrap-responsive.css", true);
            bundle.AddFile("~/Content/bootstrap.css", true);

            BundleTable.Bundles.Add(bundle);

            bundle = new Bundle("~/Content/themes/base/css", csstransformer);

            bundle.AddFile("~/Content/themes/base/jquery.ui.core.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.resizable.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.selectable.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.accordion.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.autocomplete.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.button.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.dialog.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.slider.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.tabs.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.datepicker.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.progressbar.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.theme.css", true);

            BundleTable.Bundles.Add(bundle);
        }

我做错了什么

更新

我想我最终能够通过以下方式解决这个问题：

删除AddDirectory调用

bootstrapCss.AddDirectory（“~/Static/Css”，“*.Css”）

提供不反映实际目录结构的捆绑包路径

---

如果几天前做了这件事，效果很好。我创建了一个名为

Helper

的文件夹，然后创建了一个名为

CssJsBuilder

的新类

我的班级是这样的：

public static class BundleCollectionExtensions
{
    public static void RegisterScriptsAndCss(this BundleCollection bundles)
    {
        var bootstrapCss = new Bundle("~/Static/Css", new CssMinify());
        bootstrapCss.AddDirectory("~/Static/Css", "*.css");
        bootstrapCss.AddFile("~/Static/Css/MvcValidation.css");
        bootstrapCss.AddFile("~/Static/Css/bootstrap-responsive.min.css");
        bootstrapCss.AddFile("~/Static/Css/bootstrap.min.css");

        bundles.Add(bootstrapCss);

        var bootstrapJs = new Bundle("~/Static/Js", new JsMinify());
        bootstrapJs.AddDirectory("~/Static/Js", "*.js");
        bootstrapJs.AddFile("~/Static/Js/jquery-1.7.1.min.js");
        bootstrapJs.AddFile("~/Static/Js/jquery.validate.min.js");
        bootstrapJs.AddFile("~/Static/Js/jquery.validate.unobtrusive.min.js");
        bootstrapJs.AddFile("~/Static/Js/bootstrap.min.js");
        bootstrapJs.AddFile("~/Static/Js/gunsforhire.js");

        bundles.Add(bootstrapJs);
    }
}

<link href="/Static/Css?v=D9JdmLZFFwjRwraNKfA1uei_YMoBoqLf-gFc0zHivM41" rel="stylesheet" type="text/css" />

<script src="/Static/Js?v=mbKbf5__802kj-2LS5j9Ba-wvSxBCKNMQGBgzou6iZs1" type="text/javascript"></script>

Request URL:http://localhost:49603/Static/Js?v=mbKbf5__802kj-2LS5j9Ba-wvSxBCKNMQGBgzou6iZs1
Request Method:GET
Status Code:301 Moved Permanently (from cache)
Query String Parametersview URL encoded
v:mbKbf5__802kj-2LS5j9Ba-wvSxBCKNMQGBgzou6iZs1

Request URL:http://localhost:49603/Static/Js/?v=mbKbf5__802kj-2LS5j9Ba-wvSxBCKNMQGBgzou6iZs1
Request Method:GET
Status Code:404 Not Found
Request Headersview source
Accept:*/*
Accept-Charset:ISO-8859-1,utf-8;q=0.7,*;q=0.3
Accept-Encoding:gzip,deflate,sdch
Accept-Language:en-US,en;q=0.8
Connection:keep-alive
Host:localhost:49603
Referer:http://localhost:49603/
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/535.11 (KHTML, like Gecko)        Chrome/17.0.963.56 Safari/535.11
Query String Parametersview URL encoded
v:mbKbf5__802kj-2LS5j9Ba-wvSxBCKNMQGBgzou6iZs1
Response Headersview source
Cache-Control:private
Content-Length:4757
Content-Type:text/html; charset=utf-8
Date:Thu, 01 Mar 2012 19:05:44 GMT
Server:Microsoft-IIS/7.5
X-Powered-By:ASP.NET
X-SourceFiles:=?UTF-8?B?   QzpcQENvZGVccGVsbGVccGVsbGVoZW5yaWtzc29uLnNlXHNyY1xXZWJcU3RhdGljXEpzXA==?=

public static void Initializing()
{
   IBundleTransform jstransformer;
   IBundleTransform csstransformer;

#if DEBUG
            jstransformer = new NoTransform("text/javascript");
            csstransformer = new NoTransform("text/css");
#else
      jstransformer = new JsMinify();
      csstransformer = new CssMinify();
#endif

            var bundle = new Bundle("~/Scripts/js", jstransformer);

            bundle.AddFile("~/Scripts/jquery-1.6.2.js", true);
            bundle.AddFile("~/Scripts/jquery-ui-1.8.11.js", true);
            bundle.AddFile("~/Scripts/jquery.validate.unobtrusive.js", true);
            bundle.AddFile("~/Scripts/jquery.unobtrusive-ajax.js", true);
            bundle.AddFile("~/Scripts/jquery.validate.js", true);
            bundle.AddFile("~/Scripts/modernizr-2.0.6-development-only.js", true);
            bundle.AddFile("~/Scripts/AjaxLogin.js", true);
            bundle.AddFile("~/Scripts/knockout-2.0.0.debug.js", true);
            bundle.AddFile("~/Scripts/bootstrap.js", true);
            bundle.AddFile("~/Scripts/dungeon.custom.js", true);

            BundleTable.Bundles.Add(bundle);

            bundle = new Bundle("~/Content/css", csstransformer);

            bundle.AddFile("~/Content/bootstrap-responsive.css", true);
            bundle.AddFile("~/Content/bootstrap.css", true);

            BundleTable.Bundles.Add(bundle);

            bundle = new Bundle("~/Content/themes/base/css", csstransformer);

            bundle.AddFile("~/Content/themes/base/jquery.ui.core.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.resizable.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.selectable.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.accordion.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.autocomplete.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.button.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.dialog.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.slider.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.tabs.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.datepicker.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.progressbar.css", true);
            bundle.AddFile("~/Content/themes/base/jquery.ui.theme.css", true);

            BundleTable.Bundles.Add(bundle);
        }

在那之后。转到

Global.asax

：

删除或注释掉

BundleTable.Bundles.RegisterTemplateBundles（）

将

CssJsBuilder.initialization（）

添加到

应用程序启动（）方法中
重新创建项目，然后重新启动它
希望这对你也有用
 在Global.asax.cs中替换

BundleTable.Bundles.RegisterTemplateBundles（）

与

BundleTable.Bundles.EnableDefaultBundles（）

这就是它对我的作用

这是简化版，我只使用default.aspx文件no global.asax（如果需要，您可以使用它）

在本例中，我使用了两个目录Content2和Scripts2

在Content2中，我有两个css文件，一个用于class=“naziv”，另一个用于class=“naziv2”

在Scripts2中有两个文件，一个具有函数f1（）定义，另一个具有函数f2（）定义

在/bin目录中，应该有3个文件：

Microsoft.Web.Infrastructure.dll，
System.Web.Optimization.dll，
webfeel.dll

<%@ Page Title="Home Page" Language="vb" debug="true"%>
<%@ Import namespace="System.Web.Optimization" %>

<script runat="server" >
    Sub Page_Load(sender As Object, e As EventArgs)
        System.Web.Optimization.BundleTable.EnableOptimizations = True ''true will force optimization even if debug=true

        Dim siteCssBundle = New StyleBundle("~/Content2/css")
        siteCssBundle.IncludeDirectory("~/Content2", "*.css")
        BundleTable.Bundles.Add(siteCssBundle)

        Dim siteJsBundle = New ScriptBundle("~/Scripts2/js")
        siteJsBundle.IncludeDirectory("~/Scripts2", "*.js")
        BundleTable.Bundles.Add(siteJsBundle)
    End Sub
</script>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
    <head>
    </head>
    <body onload="f1(); f2();">
        <%: Styles.Render("~/Content2/css")%>
        <%: Scripts.Render("~/Scripts2/js")%>
        <br />
        <span class="naziv">Span 1</span> <br />
        <span class="naziv2">Span 2</span> <br />
    </body>
</html>


子页面加载（发送方作为对象，e作为事件参数）
System.Web.Optimization.BundleTable.EnableOptimizations=True“True将强制进行优化，即使debug=True
Dim siteCssBundle=新样式包（“~/Content2/css”）
siteCssBundle.IncludeDirectory（“~/Content2”，“*.css”）
BundleTable.Bundles.Add（siteCssBundle）
Dim siteJsBundle=新脚本包（“~/Scripts2/js”）
siteJsBundle.IncludeDirectory（“~/Scripts2”，“*.js”）
BundleTable.Bundles.Add（siteJsBundle）
端接头


跨度1

跨度2

您所做的“错误”是您的捆绑路径与实际路径相对应。据我所知，当“/Static/Css？v=d9jdmlzffwjrrrankfa1uei_YMoBoqLf-gFc0zHivM41”的请求传入时，路由引擎首先查找物理路径。它会查找与您的文件夹“static”匹配的文件，并尝试在其中查找与“Css？v=d9jdmlzffwjrrrankfa1uei_ymobqlf-gFc0zHivM41”匹配的文件。当它找不到一个，因为它不存在，它给出一个404。（我还看到访问被拒绝。）当路由引擎找不到物理文件路径时，它会寻找其他处理程序（如捆绑和缩小）来处理请求

无论如何，我认为你已经从你的评论中了解到了这一点，但我不确定任何人发现你的问题都会非常清楚。只需从以下位置更改您的注册：

var bootstrapCss = new Bundle("~/Static/Css", new CssMinify());

致：

如果您进行了更改，您的问题将消失（假定没有与“bundles”对应的物理路径）。您所说的第2个“给出不反映真实目录结构的bundles路径”是什么意思？如果您有这样的/scripts/app目录结构，您不应该在bundle中使用该路径（“~/scripts/app”）。或者至少我在MVC4RC中遇到了一些问题。也许这不再是问题了。嗨，你知道我缺少哪个命名空间吗？我在bootstrapcss中没有得到Addfile或AddDirectory？