BundleTransformer.Less inject variables depending on context/request

Question

We would like the use the bundling mechanism of System.Web.Optimization in combination with the Less transformer.

The problem is that the same applicati

Answer 1

Michael!

You use the Microsoft ASP.NET Web Optimization Framework and the Bundle Transformer in multi-tenant environment, so you need to replace some components of the System.Web.Optimization and create own versions of the debugging HTTP-handlers (see «Problem: LESS file imports are added to BundleResponse.Files collection» discussion). As far as I know, Murat Cakir solve all these problems in the SmartStore.NET project.

In the Bundle Transformer there are 2 ways to inject of LESS-variables:

1. Look a properties GlobalVariables and ModifyVariables of LESS-translator:

   using System.Collections.Generic;
   using System.Web.Optimization;
   
   using BundleTransformer.Core.Builders;
   using BundleTransformer.Core.Orderers;
   using BundleTransformer.Core.Transformers;
   using BundleTransformer.Core.Translators;
   using BundleTransformer.Less.Translators;
   
   public class BundleConfig
   {
       public static void RegisterBundles(BundleCollection bundles)
       {
           var nullBuilder = new NullBuilder();
           var nullOrderer = new NullOrderer();
   
           var lessTranslator = new LessTranslator
           {
               GlobalVariables = "my-variable='Hurrah!'",
               ModifyVariables = "font-family-base='Comic Sans MS';body-bg=lime;font-size-h1=50px"
           };
           var cssTransformer = new CssTransformer(new List<ITranslator>{ lessTranslator });
   
           var commonStylesBundle = new Bundle("~/Bundles/BootstrapStyles");
           commonStylesBundle.Include(
              "~/Content/less/bootstrap-3.1.1/bootstrap.less");
           commonStylesBundle.Builder = nullBuilder;
           commonStylesBundle.Transforms.Add(cssTransformer);
           commonStylesBundle.Orderer = nullOrderer;
   
           bundles.Add(commonStylesBundle);
       }
   }
   

2. Create a custom item transformation:

   using System.Text;
   using System.Web.Optimization;
   
   public sealed class InjectContentItemTransform : IItemTransform
   {
       private readonly string _beforeContent;
       private readonly string _afterContent;
   
       public InjectContentItemTransform(string beforeContent, string afterContent)
       {
           _beforeContent = beforeContent ?? string.Empty;
           _afterContent = afterContent ?? string.Empty;
       }
   
       public string Process(string includedVirtualPath, string input)
       {
           if (_beforeContent.Length == 0 && _afterContent.Length == 0)
           {
               return input;
           }
   
           var contentBuilder = new StringBuilder();
           if (_beforeContent.Length > 0)
           {
               contentBuilder.AppendLine(_beforeContent);
           }
           contentBuilder.AppendLine(input);
           if (_afterContent.Length > 0)
           {
               contentBuilder.AppendLine(_afterContent);
           }
   
           return contentBuilder.ToString();
       }
   }
   

And register this transformation as follows:

    using System.Web.Optimization;

    using BundleTransformer.Core.Orderers;
    using BundleTransformer.Core.Bundles;

    public class BundleConfig
    {
        public static void RegisterBundles(BundleCollection bundles)
        {
            var nullOrderer = new NullOrderer();

            const string beforeLessCodeToInject = @"@my-variable: 'Hurrah!';";
            const string afterLessCodeToInject = @"@font-family-base: 'Comic Sans MS';
@body-bg: lime;
@font-size-h1: 50px;";

            var commonStylesBundle = new CustomStyleBundle("~/Bundles/BootstrapStyles");
            commonStylesBundle.Include(
               "~/Content/less/bootstrap-3.1.1/bootstrap.less",
               new InjectContentItemTransform(beforeLessCodeToInject, afterLessCodeToInject));
            commonStylesBundle.Orderer = nullOrderer;

            bundles.Add(commonStylesBundle);
        }
    }

Both ways have disadvantage: the injection of LESS-variables does not work in debug mode.