IItemTransform and existing minified files

Question

TL;DR: IItemTransform isn't getting executed when a minified file already exists in the same folder as the original (non-minified) file.

Problem explanation

I'm having this issue mainly because of CSS relative image references. If you used IItemTransform with Javascript files, the same applies.

This is what I'm using:

1. I'm using Visual Studio with Web Essentials addin to have support for LESS files
2. I'm writing LESS files and have Web Essentials addin automatically minify files on save
3. I'm also using bundling and minification in my project
4. When creating CSS bundles I'm using CssRewriteUrlTransform to make CSS URLs absolute (i.e. background images) so that images still work after bundling several CSS files together

Nothing unusual here so far, but it doesn't work.

What seems to be the problem?

The way that bundling and minification works is it tries to avoid excessive processing. This means that when a minified file exists in the same folder as the original one it won't run its own minification and rather serve existing file.

This would be all right as long as it would at least run transforms over those preexisting minified files. But it doesn't. So I end up with relative URLs in a bundle which breaks pretty much all those resources.

Workarounds

1. Always provide absolute paths in LESS files
2. Disable file minification on save in Web Essentials settings
3. Refer to minified files when defining my bundles because they don't have a minified version (*.min.css doens't have a *.min.min.css) so minifier actually picks up the file and minifies while also running transformations over it.

From the standpoint of my development process and tools used (and configured the way they are) this looks like a bug. If those files would be the result of the same minification process this wouldn't be a bug at all as transformations would be executed when minification would execute. It's true that such functionality doesn't exist and likely never will as app would need write permissions to make it work. Outcome: this is a bug. Existing minified files should be processed through transformations before being cached.

Question

Is it possible to somehow convince bundling and minification to either:

1. not use existing minified file versions
2. run transformations over existing minified versions

Trout

Curious if a modified version of IBundleBuilder could work, similar to this SO post. – Touchandgo

@MikeSmithDev: That's quite a plausible suggestion but when I'd already be dealing with bundled file getting to my IBundleTransform I wouldn't be able to change URL relative paths to absolute ones any more as I won't know where original files resided before bundling... – Trout

Answer 1

Have you considered using Grunt? http://gruntjs.com/

It has a learning curve, but, the information pool is huge. The issues that you are having with web essentials wouldn't be a problem with grunt.

I'm using it in VS, now, to minify, bundle and transpile both css and javascript as well as reorganize files into a deployment directory. Once you've set up a directory structure, a grunt file could very easily be reused.

With the add-on in VS (linked, below), you can right click on the grunt file and select the grunt tasks to run from a popup menu.

https://visualstudiogallery.msdn.microsoft.com/dcbc5325-79ef-4b72-960e-0a51ee33a0ff

Grunt "tasks" as they are called can be created by downloading various plugins i.e. https://www.npmjs.com/package/grunt-contrib-less.

Corregidor

Answer 2

I have never used LESS or web essentials, so please take this post for what it is worth (not much.) Could you add a pre-build command to simply delete the old files, then do a rebuild when you need to update the CSS.

Fortunato