Found here on a related question, you may use an extension for using an up-to-date minifier with Web.Optimization : BundleTransformer.
You can choose between numerous minifiers and it has many settings. Some of the minifiers are quite old and may have the same troubles, other have significant dependencies like calling an external Web service or needing a Node.js engine. So, better have a careful review of them.
For my case, I choose to use the NUglify minifier wrapper at first, then switched to Crockford's JSMin wrapper because of some current bugs in NUgilfy. So, I just had to:
- Add a NuGet reference to these two minifiers (I am still using NUglify for CSS.)
- Add the web.config configuration section for BundleTransformer, see here for a complete example needing to be trimmed down to your needs, or see below for what I use.
- In the
BundleConfig
class (or where the ScriptBundle
/StyleBundle
are defined):
- Replace the default bundle resolver:
BundleResolver.Current = new CustomBundleResolver();
. (Requires using BundleTransformer.Core.Resolvers;
.)
- Replace any instance of
ScriptBundle
by CustomScriptBundle
. (Requires using BundleTransformer.Core.Bundles;
.)
- Replace any instance of
StyleBundle
by CustomStyleBundle
. (Requires using BundleTransformer.Core.Bundles;
.)
If you were using directly the Bundle
base class, you can go on using it, but then you need to:
- Set its
Builder
property to an instance of BundleTransformer.Core.Builders.NullBuilder
.
- According to what kind of bundle it is, add an instance of
BundleTransformer.Core.Transformers.ScriptTransformer
or StyleTransformer
to its Transforms
list.
See here for more information.
Configuration section declaration, to be put under /configuration/configSections
:
<sectionGroup name="bundleTransformer">
<section name="core" type="BundleTransformer.Core.Configuration.CoreSettings, BundleTransformer.Core" />
<section name="nuglify" type="BundleTransformer.NUglify.Configuration.NUglifySettings, BundleTransformer.NUglify" />
</sectionGroup>
Example of the configuration section itself, to be put under /configuration
:
<bundleTransformer xmlns="http://tempuri.org/BundleTransformer.Configuration.xsd">
<core>
<css defaultPostProcessors="" defaultMinifier="NUglifyCssMinifier"
usePreMinifiedFiles="true" combineFilesBeforeMinification="false">
<translators>
<add name="NullTranslator" type="BundleTransformer.Core.Translators.NullTranslator, BundleTransformer.Core" enabled="false" />
</translators>
<minifiers>
<add name="NullMinifier" type="BundleTransformer.Core.Minifiers.NullMinifier, BundleTransformer.Core" />
<add name="NUglifyCssMinifier" type="BundleTransformer.NUglify.Minifiers.NUglifyCssMinifier, BundleTransformer.NUglify" />
</minifiers>
<fileExtensions>
<add fileExtension=".css" assetTypeCode="Css" />
</fileExtensions>
</css>
<js defaultPostProcessors="" defaultMinifier="CrockfordJsMinifier"
usePreMinifiedFiles="true" combineFilesBeforeMinification="false">
<translators>
<add name="NullTranslator" type="BundleTransformer.Core.Translators.NullTranslator, BundleTransformer.Core" enabled="false" />
</translators>
<minifiers>
<add name="NullMinifier" type="BundleTransformer.Core.Minifiers.NullMinifier, BundleTransformer.Core" />
<add name="NUglifyJsMinifier" type="BundleTransformer.NUglify.Minifiers.NUglifyJsMinifier, BundleTransformer.NUglify" />
<add name="CrockfordJsMinifier" type="BundleTransformer.JsMin.Minifiers.CrockfordJsMinifier, BundleTransformer.JsMin" />
</minifiers>
<fileExtensions>
<add fileExtension=".js" assetTypeCode="JavaScript" />
</fileExtensions>
</js>
<assetHandler disableServerCache="false" serverCacheDurationInMinutes="15"
disableClientCache="false" />
</core>
<nuglify>
<css fixIE8Fonts="false" />
<js macSafariQuirks="true" />
</nuglify>
</bundleTransformer>