I suggest you ...

Improve System.Web.Optimization.Bundle

Add method to get relative path to files in bundle ("~/Scripts/file.js"). In particular it could be path, used when bundle was created (bundle.AddFile("~/Scripts/file.js"). New method very similar to System.Web.Optimization.Bundle.EnumerateFiles()

The purpose of new method (let's say "IEnumerable<string> GetFilesPath()") is changing HTML output when application in "debug" mode (the "debug" property value of the <compilation> element of the web.config file is "true"):
@helper JsBundle(string bundleUrl) {
if(HttpContext.Current.IsDebuggingEnabled) {
foreach(string filePath in BundleTable.Bundles.GetBundleFor(bundleUrl).GetFilesPath()) {
<script src="@filePath" type="text/javascript"></script>
}
}
else {
<script src="@BundleTable.Bundles.ResolveBundleUrl(bundleUrl)" type="text/javascript"></script>
}
}

23 votes
Vote
Sign in
Check!
(thinking…)
Reset
or sign in with
  • facebook
  • google
    Password icon
    I agree to the terms of service
    Signed in as (Sign out)
    You have left! (?) (thinking…)
    resnyanskiyresnyanskiy shared this idea  ·   ·  Flag idea as inappropriate…  ·  Admin →

    3 comments

    Sign in
    Check!
    (thinking…)
    Reset
    or sign in with
    • facebook
    • google
      Password icon
      I agree to the terms of service
      Signed in as (Sign out)
      Submitting...
      • Howard DierkingAdminHoward Dierking (ASP.NET, ASP.NET Future Feature Feedback) commented  ·   ·  Flag as inappropriate

        Hi - actually, in the version of bundling that we're planning to release pretty soon, we're doing something similar.

        Bundles will still be declared and configured like normal. For views, however, we’ve now added an asset manager that is capable of building up the list bundles or regular script/css assets that you need in your page and then rendering links. This will provide much better support for the debug/release scenario that you describe. For example, you would have code like this in your view:

        <head>
        <meta charset="utf-8" />
        <title>@ViewBag.Title</title>

        @{
        //all of these are bundles
        Assets.AddStyle("~/Content/css");
        Assets.AddStyle("~/Content/themes/base/css");
        Assets.AddScript("~/Scripts/js");
        }

        @Assets.GetStyles()
        @Assets.GetScripts()
        </head>

        When you’re in release mode, you would see this in your page (links to the 3 bundles defined above):

        <head>
        <meta charset="utf-8" />
        <title>@ViewBag.Title</title>
        <link rel="stylesheet" href="/content/css" type="text/css" />
        <link rel="stylesheet" href="/content/themes/base/css" type="text/css" />
        <script type=”text/javascript” src=”/scripts/js”></script>
        </head>

        In debug mode, however, the asset manager would automatically expand the contents of the bundle to individual links - so you would see something more like this:

        <head>
        <meta charset="utf-8" />
        <title>@ViewBag.Title</title>
        <link rel="stylesheet" href="/Content/site.css " type="text/css" />
        <link rel="stylesheet" href="/content/themes/base/jquery.ui.core.css " type="text/css" />
        <link rel="stylesheet" href="/content/themes/base/jquery.ui.resizable.css " type="text/css" />
        <link rel="stylesheet" href="/content/themes/base/ jquery.ui.selectable.css " type="text/css" />
        <link rel="stylesheet" href="/content/themes/base/ jquery.ui.accordion.css " type="text/css" />
        <link rel="stylesheet" href="/content/themes/base/ jquery.ui.autocomplete.css " type="text/css" />
        <link rel="stylesheet" href="/content/themes/base/ jquery.ui.button.css " type="text/css" />
        <link rel="stylesheet" href="/content/themes/base/ jquery.ui.dialog.css " type="text/css" />
        <link rel="stylesheet" href="/content/themes/base/ jquery.ui.slider.css " type="text/css" />

        ...
        </head>

        hope this helps

      Feedback and Knowledge Base