Helper for auto removing duplicate css, js...
If you need to use a lot of partial views, child actions... and each requires some javascripts, stylesheets... for working.
- Without BundleHelper, you can solve that issue by those solutions:
- Include javascripts/stylesheets... inside partial views. But your page will render a lot of duplicated scripts/css and can lead to a conflict.
- Include javascripts/stylesheets... only in the parent views. But you need remember to include them when create new views.
- With BundleHelper, you just include all required scripts/stylesheets in your partial views or action views... This tool will help you remove duplicated entries, place them into correct place of page (end of head or body tag), so developers can maintain code easier and client can browse page faster.
- [REQUIRED] You must add those code to master layout file (default: ~/View/Shared/_Layout.cshtml)
<html>
<head>
<!-- content of head -->
@Html.RenderStyles() <!-- render stylesheets -->
@Html.RenderHeadScripts() <!-- should render javascript frameworks at the end of head tag -->
</head>
<body>
<!-- content of body -->
@Html.RenderBodyScripts() <!-- should render javascripts at the end of body -->
</body>
</html>- In your views or partial views... refer to external javascripts/stylesheets by those functions:
@Html.AddStyle("~/Content/Site.css")
@Html.AddStyle("~/Content/css", int.MaxValue)
@Html.AddHeadScript("~/bundles/jquery")
@Html.AddHeadScript(@<script>alert('this is script on head tag');</script>, 100)
@Html.AddBodyScript(@<script>alert('this is script at end of body tag');</script>)
@Html.AddBodyScript("~/Scripts/HelloWorld.js", 9999)- You can also add directly javascripts/css into your views (not recommended):
@Html.AddStyle(@<style>body { background-color:red; }</style>)
@Html.AddHeadScript(@<script>alert('this is BundleHelper');</script>)
@Html.AddBodyScript(
@<div>
<script>
alert('we can add multiple scripts at one time...');
</script>
<script>
alert('...like this.');
</script>
</div>)- If you need to include some javascripts/stylesheets for all views of a controller but not for other controllers. Add those attributes for that controller:
[UsingStyles("~/Content/Site.css", "~/Content/css")]
[UsingHeadScripts(100, "~/bundles/jquery", "~/Scripts/Global.js")]
[UsingBodyScripts(int.MaxValue, "~/bundles/jquery", "~/Scripts/HelloWorld.js")]
public class BookController : Controller
{
// code here
}- You can install it easily via Nuget: https://www.nuget.org/packages/BundleHelper/
- Or just copy those files into your project (put them to any folder you want)
- BundleHelper.cs
- InlineBundleHelper.cs
- UsingAttributes.cs
-
Version Date Description -
2.2 Build 2 Jan-07-2014 Fixed critical bug. -
2.2 Build 1 Jan-06-2014 Fixed bug duplicated javascripts/stylesheets if using bundling. -
2.2 Jan-03-2014 Updated feature to order javascripts/stylesheets by ascending number. -
2.1 Sep-10-2013 Fixed bugs when inline javascripts/stylesheets have comments -
2.0 Build 2 Jul-08-2013 Just updated for new format of version's build numer. -
2.0 Build 1 Jul-03-2013 Updated some minor changes related to dependencies... -
2.0 Jul-01-2013 Added feature compress inline javascripts, inline css... -
1.2 Build 1 Jun-28-2013 Updated for some minor enhancements -
1.2 Jun-27-2013 Refactored code -
1.1 Build 5 Jun-26-2013 Fixed to ignore case for checking duplicated items -
1.1 Jun-26-2013 Updated for supporting Using Attributes -
1.0 Jun-25-2013 First draft