Tuesday, August 27, 2013

Bundling in Asp .net 2010


Adding Bundling in Simple .net Web Forms

Create a new ASP.NET Web Forms application which targets the .Net 2.0 framework.
Now add  "System.Web.Optimization.dll" reference in Visual studio.

Now Adding Scripts and CSS file reference in page with some HTML.


Then Run the application launch the Mozilla F-12 developer tools. Select the Script tab or CSS tab, and then use the assets button to view the all JavaScript or CSS files.




You can select one of the JavaScript or CSS files and view it in the left pane. Note the full (non-minimized version) of the files are used.

Creating the JavaScript and CSS Bundles


Adding JavaScript and CSS file to the BundleConfig class in the App_Start folder. The following code shows the complete BundleConfig class:


Register the Bundles

The templates create the code hook up the bundle registration in the Application_Start method in the Global.asax” file.




After adding BundleConfig class in the App_Start folder, Solution structure is look like below image.


Reference the Bundles in web form


Add the JavaScript and CSS bundles to the head markup as shown in the following code:

Now run the application launch the Mozilla F-12 developer tools. Select the Script tab or CSS tab, and then use the assets button to view the JavaScript or CSS files. You can see only one JavaScript and CSS files are there and it’s fully minimized version.







No comments:

Post a Comment