benmccallum/aspnetbundling

An assortment of bundling utility classes like custom transformers and fixes for the ASP.NET Web Optimization bundling framework.

AspNetBundling

An assortment of bundling utility classes like a ScriptWithSourceMapBundle and fixes for the ASP.NET Web Optimization bundling framework.

Get it on NuGet!

Install-Package AspNetBundling

Bundling with SourceMap generation

BundleTable.Bundles.Add(new ScriptWithSourceMapBundle("MyBundleVirtualPath")
  .Include("MyJsFileOne.js", "MyJsFileTwo.js")
);

By default, this will create a bundle with no cdnPath, codeMinify on, preserveImportantComments on, and a source map delivered at bundleVirtualPath + "map".

For other variations of this, you can use the another ScriptWithSourceMapBundle constructor, or set the properties on it after instantiation. A more complete list of some examples is in the TestWebsite project > App_Start > BundleConfig.cs.

Known issues:

1. A current bug in AjaxMin reported by @LodewijkSioen here https://ajaxmin.codeplex.com/workitem/21834, causes the minification to hang when the debugger is attached and we're trying to do proper sourcemapping. As such, to avoid more harm than good, we don't support proper source mapping in this scenario until AjaxMin fixes it's bug.

Bundling with Css Rewrite Url Tranformer fix

BundleTable.Bundles.Add(new StyleBundle("MyBundleVirtualPath")
  .Include("MyCssFileOne.css, new CssRewriteUrlTransformFixed())
  .Include("MyCssFileTwo.css, new CssRewriteUrlTransformFixed())
);

Upgrade guide

v2 to v3

I've changed the default behaviour of bundles to minify code (rather than just remove whitespace) as the default should be the best for the end user. In doing this, some people using Angular that need DI variable names to be maintained will need to ensure they're now opting in to no code minification with the appropriate ScriptWithSourceMapBundle constructor overload.

aspnetbundling's Issues

Incorrect CSS virtual path to absolute path transformation

Hello,
we have an app that is running in the server/MyApp path.

We are using System.Web.Optimization.CssRewriteUrlTransformFixed() to transform URL, but because we are not in root, but MyApp path, relative paths are resolved incorrectly.

Basically
we have something like

var urlTransform = new System.Web.Optimization.CssRewriteUrlTransformFixed();
bundles.Add(new LessBundle("~/Shared/CSS/common")
    .CheckAndInclude("~/Shared/CSS/external/jquery-ui/jquery-ui.css", urlTransform));

and in jquery-ui.css is

.ui-widget-content {
    background: url("images/ui.png");
}

and the transformed URL in CSS is

/Shared/CSS/external/jquery-ui/images/ui.png

instead of

/MyApp/Shared/CSS/external/jquery-ui/images/ui.png

See also http://aspnetoptimization.codeplex.com/workitem/83 and http://stackoverflow.com/a/17702773/2622707.

As a workaround we are using a copy as CssRewriteUrlTransformFixed with following line

var directory = "~" + VirtualPathUtility.GetDirectory(includedVirtualPath.Substring(1));

although I think would work as well

var directory = VirtualPathUtility.GetDirectory(includedVirtualPath);

Is there some reason for stripping tilda from path? If not, would it be possible to fix this?

Thank you very much.

CssRewriteUrlTransformFixed strips out quotes in url

I had some issues with embedded graphics in a background image. Here is the CSS:

background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100%' height='1'><rect fill='#c8c7cc' x='0' y='0' width='100%' height='0.5'/></svg>");

As you know, the ASP.NET bundling system wants to make the "data" part a relative URL and the image breaks. I installed your Nuget and, while it corrects that behavior, it also seems to strip the containing quotes inside the "url" value and the image can't be rendered.

According to Chrome's inspector, the CSS looks like this:

background-image: url(data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100%' height='1'><rect fill='#c8c7cc' x='0' y='0' width='100%' height='0.5'/></svg>);

I think it must be something in your regex match/replace.

Thanks,
Matthew

ScriptWithSourceMapBundle not found in AspNetBundling

No se puede cargar el tipo 'AspNetBundling.ScriptWithSourceMapBundle' del ensamblado 'AspNetBundling, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null'.

Generating .map files of CSS is pointless, remove.

Since AjaxMin doesn't support map file generation for CSS, just remove the complication added by attempting it.

An exception occurred trying to build bundle contents for bundle

Hello,

I just noticed that the bundling is throwing an error on the VS output window. This is asp.net mvc web app .net 4.7.2:

w3wp.exe Information: 0 : [Bundle '~/bundles/system'] exception message: Stack empty.
w3wp.exe Information: 0 : [Bundle '~/bundles/system'] source: System
w3wp.exe Information: 0 : [Bundle '~/bundles/system'] stack trace:    at System.ThrowHelper.ThrowInvalidOperationException(ExceptionResource resource)
   at System.Collections.Generic.Stack`1.Pop()
   at Microsoft.Ajax.Utilities.OutputVisitor.Visit(FunctionObject node)
   at Microsoft.Ajax.Utilities.FunctionObject.Accept(IVisitor visitor)
   at Microsoft.Ajax.Utilities.OutputVisitor.AcceptNodeWithParens(AstNode node, Boolean needsParens)
   at Microsoft.Ajax.Utilities.OutputVisitor.Visit(CallNode node)
   at Microsoft.Ajax.Utilities.CallNode.Accept(IVisitor visitor)
   at Microsoft.Ajax.Utilities.OutputVisitor.Visit(Block node)
   at Microsoft.Ajax.Utilities.OutputVisitor.OutputFunctionArgsAndBody(FunctionObject node)
   at Microsoft.Ajax.Utilities.OutputVisitor.Visit(FunctionObject node)
   at Microsoft.Ajax.Utilities.FunctionObject.Accept(IVisitor visitor)
   at Microsoft.Ajax.Utilities.OutputVisitor.AcceptNodeWithParens(AstNode node, Boolean needsParens)
   at Microsoft.Ajax.Utilities.OutputVisitor.Visit(BinaryOperator node)
   at Microsoft.Ajax.Utilities.OutputVisitor.Visit(Block node)
   at Microsoft.Ajax.Utilities.OutputVisitor.OutputFunctionArgsAndBody(FunctionObject node)
   at Microsoft.Ajax.Utilities.OutputVisitor.Visit(FunctionObject node)
   at Microsoft.Ajax.Utilities.FunctionObject.Accept(IVisitor visitor)
   at Microsoft.Ajax.Utilities.OutputVisitor.Visit(ClassNode node)
   at Microsoft.Ajax.Utilities.ClassNode.Accept(IVisitor visitor)
   at Microsoft.Ajax.Utilities.OutputVisitor.Visit(Block node)
   at Microsoft.Ajax.Utilities.OutputVisitor.OutputFunctionArgsAndBody(FunctionObject node)
   at Microsoft.Ajax.Utilities.OutputVisitor.Visit(FunctionObject node)
   at Microsoft.Ajax.Utilities.FunctionObject.Accept(IVisitor visitor)
   at Microsoft.Ajax.Utilities.OutputVisitor.AcceptNodeWithParens(AstNode node, Boolean needsParens)
   at Microsoft.Ajax.Utilities.OutputVisitor.Visit(CallNode node)
   at Microsoft.Ajax.Utilities.CallNode.Accept(IVisitor visitor)
   at Microsoft.Ajax.Utilities.OutputVisitor.Visit(AstNodeList node)
   at Microsoft.Ajax.Utilities.AstNodeList.Accept(IVisitor visitor)
   at Microsoft.Ajax.Utilities.OutputVisitor.Visit(BinaryOperator node)
   at Microsoft.Ajax.Utilities.OutputVisitor.Visit(Block node)
   at Microsoft.Ajax.Utilities.Block.Accept(IVisitor visitor)
   at Microsoft.Ajax.Utilities.OutputVisitor.Apply(TextWriter writer, AstNode node, CodeSettings settings)
   at Microsoft.Ajax.Utilities.Minifier.MinifyJavaScript(String source, CodeSettings codeSettings)
   at AspNetBundling.ScriptWithSourceMapBundleBuilder.BuildBundleContent(Bundle bundle, BundleContext context, IEnumerable`1 files)`



`            bundles.Add(new ScriptWithSourceMapBundle("~/bundles/system").Include(
                      //"~/Scripts/VideoFrame.js",
                      ////"~/Scripts/smpte-timecode.js",
                      "~/Scripts/jquery.hotkeys.js",
                      "~/Scripts/noty/jquery.noty.js",
                      "~/Scripts/noty/layouts/bottomRight.js",
                      "~/Scripts/noty/layouts/centerWidth700.js",
                      "~/Scripts/noty/layouts/bottomLeft.js",
                      "~/Scripts/noty/layouts/center.js",
                      "~/Scripts/noty/themes/default.js",
                      "~/Areas/Shared/Scripts/RSystem.js"  ));   //As soon as I include any script within an area, I get the error


I do not know why this is happening or how to find the route cause. Any ideas? or pointers in the right direction?
Thanks

Couldn't create sourcemap

Hi,

First of all thank you for your wonderful work.

I generated source map with latest version of AspNetBundling but it ended up creating the wrong source map file, for example 'xxxxxx.min.jsmap'

Kind regards,
Yui

can't use ScriptWithSourceMapBundle() with GenerateBundleResponse?

We save off the generated bundle to a file with code that looks something like this:

var scriptBundle = new ScripBundle("~/Scripts/Js").IncludeDirectory("~/Themes/Default/Scripts/foundation/base", "*.js");
BundleTable.Bundles.Add(scriptBundle);
scriptBundle.GenerateBundleResponse(new BundleContext(ctx, BundleTable.Bundles, scriptBundle.Path));
File.WriteAllText(combinedPath, response.Content);

That doesn't work when I try using ScriptWithSourceMapBundle(). The response.Content() seems to have the uniminfied JavaScript after the minified JavaScript, and I there doesn't seem to be a way to get the map file so I can save that as well?

CSS sourcemap support?

Some sort of StyleWithSourceMapBundle class to include CSS sourcemaps would be nice.

Huge Performance Issues

I have found a number of performance issues:

1. For each bundle request AjaxMinBundleBuilder.BuildBundleContent writes to disk a .map file according to the contents in the bundle.
   • Appending a version querystring to the filename and comparing it with the bundle version querystring you can avoid from writing a new .map file to disk.
2. Can the builder attach to the bundle process at app_start? Then the map file generation will only happen at application initialisation not with every request.

Workaround for AjaxMin hanging when debugger is attached

Generating .map files doesn't take into account the fact that transforms could be applied

Since Asp.Net Bundling has this idea of tranforms, the JS used as input to minification could have undergone transformation from it's file contents.

i.e:
script.js + script2.js + script3.js > transformed script.js in memory + script2.js + script3.js > bundled and minified response.

As such, I should detect if transformation is going to happen on a bundle file, write the transformed contents to a script.transformed.js file in the filesystem, and source map to that, so at least there is some relevant mapping still.

I wonder how many people actually use transforms with JS files anyway.