1

In my .cshtml file, I have the following:

@Scripts.Render("~/js/all")

I am seeing errors like this when I click the link that corresponds to the code, above, on my page:

/* Minification failed. Returning unminified contents.
(14662,36-37): run-time error JS1195: Expected expression: )
(14662,39-40): run-time error JS1195: Expected expression: >
(14667,31-32): run-time error JS1004: Expected ';': )
[truncated for clarity]
(14850,34-35): run-time error JS1197: Too many errors. The file might not be a JavaScript file: (
[truncated for clarity]
 */

The line numbers correspond to JavaScript code that includes the => operator. From what I can see, => was introduced in ES6 (June 17, 2015) which is a year after the last revision of Microsoft.AspNet.Web.Optimization (Feb 20, 2014). I have searched and not found a solution. Is there a new Bundler/Minifier library that should be used instead?

Bob Kaufman
  • 12,864
  • 16
  • 78
  • 107
  • 1
    Hi Bob, shouldn't this be tagged as an `asp`, `C#` or `.Net` question? Although you're asking about the JS `=>` operator it seems to me that the solution is not a Javascript solution, but rather a Microsoft.AspNet solution. – Stephen P Dec 13 '22 at 18:15
  • @StephenP yes it should, and I was trying to decide which. I was also considering asp-net-mvc Thinking that is the best choice here. – Bob Kaufman Dec 13 '22 at 19:28

1 Answers1

3

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>
Frédéric
  • 9,364
  • 3
  • 62
  • 112