File compressing/minifying in development vs production

[rvasquez87]

Hello,

I am trying to convert my website to MVC Core 2.0 and I want to use Smidge for bundling. My only issue is that I have a lot of views, each of them rendering their own specific bundles of css/js files and I would prefer not having to wrap each of them in the <Environment> tags and adding the debug=’true’ attribute. My question is, is there a way to configure Smidge to not combine/minify files in development mode when you are creating a bundle? I see that there are BundleEnvironmentOptions and I thought these would allow me to do something like:

bundles.Create("js-bundle-test",
  new JavaScriptFile("~/js/test1.js"),
  new JavaScriptFile("~/js/test2.js"))
  .WithEnvironmentOptions(BundleEnvironmentOptions.Create()
     .ForDebug(builder => builder
        //Do NOT combine/minify files
     .ForProduction(builder => builder
        //combine/minify files (although I believe this is the default so I shouldn’t have a problem here)
     .Build()
);

The options available appear to be: EnableFileWatcher, EnableCompositeProcessing, CacheControlOptions, and SetCacheBusterType. I have gone through the documentation and haven’t been able to find an explanation on what each of these do exactly so I’m not sure if any of them are what I’m looking for.

So in summary, is it possible to configure Smidge to not combine/minify files in development mode when I’m creating the bundle? and if so how would I do that? Or can this only be accomplished using the Environment tags and the debug attribute?

[Shazwazza]

My question is, is there a way to configure Smidge to not combine/minify files in development mode when you are creating a bundle?

By default Smidge doesn't minify or combine files in debug mode, you don't have to do anything.

You can however tell Smidge to do this in debug mode by using the environment options and using EnableCompositeProcessing. You can see the default environment options for debug here: https://github.com/Shazwazza/Smidge/blob/master/src/Smidge/Options/BundleEnvironmentOptions.cs#L28

I would prefer not having to wrap each of them in the tags and adding the debug=’true’ attribute

Docs on the debug flag is here: https://github.com/Shazwazza/Smidge/wiki/Rendering#debugging

If you don't want to use environment tags to wrap your declarations in your views and want to reduce the markup you'd need, then you have some options:

• Create your own tag helper that does this wrapping for you and sets the debug parameter based on the environment
• Create an extension method that wraps the helper methods you need (i.e. CssHereAsync, JsHereAsync, GenerateJsUrlsAsync and GenerateCssUrlsAsync) and sets the debug flag according to the environment you are running in. For example, you could create an extension method for SmidgeHelper and it could look something like: @await SmidgeHelper.JsHereForEnvironmentAsync("libs-js") and inside this extension method you are calling SmidgeHelper.JsHereAsync and setting the debug parameter of this method according to your environment
• Create a partial view with a string model and just put the wrapped environment tags there, then just call this partial view when you want to render a bundle, example:
  • Partial view:

  @model string
  <environment names="Development">
      <script src="@Model" type="text/javascript" debug="true"></script>
  </environment>
  <environment names="Staging,Production">
      <script src="@Model" type="text/javascript"></script>
  </environment>
  

  • Render it:

  @Html.Partial("RenderBundle", "my-awesome-bundle")