Declarations

Pre-defined bundles

Define your bundles during startup:

services.UseSmidge(bundles =>
    {
        //Defining using JavaScriptFile's or CssFile's:

        bundles.Create("test-bundle-1", //bundle name
            new JavaScriptFile("~/Js/Bundle1/a1.js"),
            new JavaScriptFile("~/Js/Bundle1/a2.js"));

        //Or defining using file/folder paths (also supports file globbing patterns):

        bundles.Create("test-bundle-2", WebFileType.Js, 
            "~/Js/Bundle2", "~/Js/OtherFolder/*.js");

        //Then there's all sorts of options for configuring bundles with regards to customizing their 
        //individual pipelines, customizing how rendering is done based on Debug or Production environments, 
        //if you want to enable file watchers, configure custom cache busters or the 
        //cache control options, etc... There's even a fluent API to do this! Example: 

        bundles.Create("test-bundle-3", WebFileType.Js, "~/Js/Bundle3")
		    .WithEnvironmentOptions(BundleEnvironmentOptions.Create()
				.ForDebug(builder => builder
					.EnableCompositeProcessing()
					.EnableFileWatcher()
					.SetCacheBusterType<AppDomainLifetimeCacheBuster>()
					.CacheControlOptions(enableEtag: false, cacheControlMaxAge: 0))
              //You could also do .ForProduction here too!
				.Build()
    });

There are quite a few overloads and options for creating bundles.

View based declarations:

Inline individual declarations:

If you don't want to create named bundles and just want to declare dependencies individually, you can do that too and Smidge will generate the URLs for these dependencies (they are essentially runtime bundles)

Require multiple files

@{ Smidge.RequiresJs("~/Js/test1.js", "~/Js/test2.js"); }

Require a folder - optionally you can also include filters/file globbing patterns (i.e. this includes all .js files)

@{ Smidge.RequiresJs("~/Js/Stuff/*.js"); }

Chaining:

@{ Smidge
    //external resources work too!
    .RequiresJs("//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js")
    .RequiresJs("~/Js/Folder/*.js")
    .RequiresCss("~/Css/test1.css", "~/Css/test2.css", "~/Css/test3.css", "~/Css/test4.css");  
}

Inline bundles:

You can create/declare bundles inline in your views too using this syntax:

JS Bundle:

@{ SmidgeHelper
        .CreateJsBundle("my-awesome-js-bundle")
        .RequiresJs("~/Js/test1.js", "~/Js/test2.js")
        .RequiresJs("~/Js/Folder/*.js");
}

CSS Bundle:

@{ SmidgeHelper
        .CreateCssBundle("my-cool-css-bundle")
        .RequiresCss("~/Css/test1.css", "~/Css/test2.css", "~/Css/test3.css");
}

Custom ordering

If you need to order your dependencies in a custom way, you can do this both by using an Order parameter on your assets, or via code with a callback method.

You can supply an Order property to any IWebFile, the default is zero and it cannot be less than zero. If you assign an Order then it will be taken into account before the collection of files is processed.

For a more dynamic approach when using bundles, you can assign a callback. So you bundle definition could look something like:

bundles.Create("test-bundle-1",
    new JavaScriptFile("~/Js/Folder/*.js"),
    new JavaScriptFile("~/Js/Bundle1/a2.js"))
    .OnOrdering(collection =>
    {
        //return some custom ordering
        return collection.OrderBy(x => x.FilePath);
    });