p2p.wrox.com Forums

p2p.wrox.com Forums (http://p2p.wrox.com/)
-   BOOK: Beginning ASP.NET 4.5 : in C# and VB (http://p2p.wrox.com/book-beginning-asp-net-4-5-c-vb-710/)
-   -   Ch 19 Bundling and Minification (http://p2p.wrox.com/book-beginning-asp-net-4-5-c-vb/92147-ch-19-bundling-minification.html)

AlanWheeler February 9th, 2014 04:51 PM

Ch 19 Bundling and Minification
 
Hi Imar,

I'm having trouble with the Microsoft.Web.Optimization package.

When I first tried to install it from the Package Manger Console I received an error that the package could not be found. I then reread the section and used NuGet to search on "optimization". It returned "Microsoft ASP.NET Web Optimization Framework". I don't know if that's the same thing as in the text, but it's all I could find that seemed close. I installed it.

In Global.asax the line "Microsoft.Web.Optimization.BundleTable.Bundles.En ableDefaultBundles()" doesn't work. Error is that "Optimization is not a member of Web". But "Web.Optimization.BundleTable.Bundles." works OK up to that point, but I don't know what to select after that. There is a method "GetRegisteredBundles()" but that doesn't read like it is enabling anything but rather returning the registered collection.

So I'm stuck not knowing how to enable the bundling and minification.

Any idea what I'm doing wrong?

Thanks.

Best Regards,
Alan

Imar February 17th, 2014 06:19 PM

Hi Alan,

Here's what I have on bundling in the upcoming update for ASP.NET 4.5.1:

1. Run the following package command:

Code:

Install-Package Microsoft.AspNet.Web.Optimization.WebForms
2. Open up your Global.asax file and at the top of the file, below the Import statement for the System.Net.Mail namespace, add the following Import statement:

Code:

<%@ Import Namespace="System.Web.Optimization" %>
3. In the Application_Start event handler in the same file, add the following code below the line that creates the ScriptResourceDefinition.

Code:

VB.NET
BundleTable.Bundles.Add(New StyleBundle("~/StyleSheets").
IncludeDirectory("~/Styles", "*.css"))
C#
BundleTable.Bundles.Add(new StyleBundle("~/StyleSheets").
IncludeDirectory("~/Styles", "*.css"));

4. Open the Frontend master page and right before the closing <head> tag add the following code:
Code:

<webopt:bundlereference runat="server" path="~/StyleSheets" />
</head>

Hope this works for you too.

Cheers,

Imar

AlanWheeler March 3rd, 2014 05:42 PM

Hi Imar,

I worked on this today as well and unfortunately was unable to follow your updated code listed in this thread.

The problem I'm running into is that Visual Studio is not accepting the syntax. It doesn't accept the syntax in the ch 19 downloaded code, nor the code listed above.

I can type this:

Code:

BundleTable.Bundles.Add(New StyleBundle("~/StyleSheets"))
But it will not accept this:

Code:

BundleTable.Bundles.Add(New StyleBundle("~/StyleSheets").IncludeDirectory("~/Styles", "*.css"))
The syntax just above looks odd regarding parenthesis as well as the '.' separator. I thought maybe the '.' before IncludeDirectory should be a comma, but Intellisense doesn't show an overload option for 2 parameters for the Add method.

So I'm not getting the effect of whatever the IncludeDirectory is doing. Since the IDE won't accept the syntax, obviously bundling is not going to work.

Any ideas?

Also, I noticed in your code that you have "~/StyleSheets". There's not a folder named "StyleSheets" in the Planet Wrox website. Is "StyleSheets" correct, or is it supposed to be "Styles"?

Thanks.

Best Regards,
Alan

Imar March 5th, 2014 06:46 AM

Hi there,

I just tried this on a copy of chapter 19 from the 4.5 book and it works fine for me. Are you sure you followed all steps correctly? Did the package install successfully and did you add the correct Import statement?

Also, can you define "Since the IDE won't accept the syntax". Do you get a helpful hint when you press Ctrl+. on the offending code?

The StyleSheets folder is correct, as that's the name the bundle listens to. In Global.asax this virtual path is created by letting it look at all the *.css files in the Styles folder. The syntax is correct too; the .IncludeDirectory is a method on the StyleBundle that gets added.

Hope this helps,

Imar

AlanWheeler March 5th, 2014 06:13 PM

Hi Imar,

The syntax error was
Code:

'Optimization' is not a member of 'Web'
And yes, I think Microsoft.Web.Optimization was installed according to NuGet, but - I'm not sure I understand why, my project had a significant number more of installed packages than the downloaded source, and not the same packages. Although I found in NuGet manager the Id = Microsoft.Web.Optimization, I didn't see the exact same .dll file that was in your source download file set. So I started over.

I copied the Final version and tried working with that again. I was able to see the bundler working correctly.

I'm not sure the difference was caused by my using Visual Studio 2013. Your downloaded source obviously runs just fine in VS2013. However, as I worked through the book and downloaded packages through NuGet, I don't think I always got the same packages because of updates to the packages NuGet downloads. That may have been a source of problems. If I don't have the right .dll I'll get a syntax error, yes?

I did notice an interesting thing. When I deleted the test2.css the color green went away. When I replaced the test2.css, the color green did not come back. But if I closed the solution and reopened it, then the color green came back. That was a source of some problem because with your downloaded code, the test2.css file is not present (not meaning that's a problem on your end, just a fact), and merely adding it to the project didn't get it into the bundler.

Another thing you may already be aware of, but it caused an issue for me that took a while to figure out. When we copy the source code, the build process throws warnings about updating files. I wrote up what I think is the solution here;

http://social.msdn.microsoft.com/For...lstudiogeneral

But it all worked out.

Anyway, your comments on knowing how to pick the right NuGet packages would be appreciated, and how do we know how to use those packages? Where do we find the documentation for them, etc.?

Best Regards,
Alan

Imar March 6th, 2014 07:02 AM

Quote:

If I don't have the right .dll I'll get a syntax error, yes?
It depends. If you have an old DLL and try to use new functionality, then yes.

Quote:

Anyway, your comments on knowing how to pick the right NuGet packages would be appreciated, and how do we know how to use those packages? Where do we find the documentation for them, etc.?
When you don't specify a version, you get the latest available. Using the NuGet Package Manager dialog you can see available updates and choose which ones you want to update. Checkout the NuGet docs at http://docs.nuget.org/ for more information.

Cheers,

Imar

Matt_Lee August 2nd, 2016 07:04 PM

How to bundle scripts
 
Hello Imar

After following your clear instructions in bundling and minifying CSS files, it has worked out very smoothly for me.

However, I am not having the same experience in trying to enable bundling and minifying scripts.

I used the exact same approach for CSS, but tried to customize it for Scripts as follows:

In the Global.asax file, I added:
BundleTable.Bundles.Add(New ScriptBundle("~/ScriptSheets").IncludeDirectory("~/Scripts", "*.js"))

and in the MasterPage, I added:
<webopt:BundleReference runat="server" Path="~/ScriptSheets" />

After adding this, I see these kind of errors in my web console:
The stylesheet http://localhost:64961/Scripts/jquery-2.1.4.js was not loaded because its MIME type, "application/javascript", is not "text/css".

In researching online, I found there appears to be a different way to reference the newly created bundled files that includes referring to the type of file. Here is what I tried using (placed just under </asp:ScriptManager>):

<asp:PlaceHolder runat="server">
<%: Web.Optimization.Scripts.Render("~/ScriptSheets") %>
<%: Web.Optimization.Styles.Render("~/StyleSheets") %>
</asp:PlaceHolder>

I thought this would help since it is specifying the type of file (e.g. ".Scripts"). But by using this instead of webopt, I no longer see the bundled files when I "View Page Source".

I also have some so-called "Advanced" ASP books (not bad, but I've found not as good as your "Beginning" book), but none show what syntax to use to properly implement bundling/minifying scripts.

Can you tell me what am I missing? Thank you for your time in advance.

Imar August 9th, 2016 01:18 PM

Hi there,

Sorry for my late reply; I was on vacation.

A lot has changed in VS since the book was released so not everything in the book still applies. I recommend you use File | New Web Site and then create a new Web Forms site. Then search for Modernizer to find files like BundleConfig.cs to see how it's set up in an out of the box web site.

Cheers,

Imar


All times are GMT -4. The time now is 05:42 PM.

Powered by vBulletin®
Copyright ©2000 - 2017, Jelsoft Enterprises Ltd.
2013 John Wiley & Sons, Inc.