简体   繁体   English

Uglify mangles ES6 function 但在 ES5 中不是同一个

[英]Uglify mangles ES6 function but not the same one in ES5

I'm using NUglify , actually, but I don't know if that matters here.实际上,我正在使用NUglify ,但我不知道这在这里是否重要。

I've recently moved my codebase from ES5 to ES6 (ES2015) and I'm getting errors on code like this jQuery plugin:我最近将我的代码库从 ES5 移到了 ES6 (ES2015),我在代码上遇到了这样的错误 jQuery 插件:

    (function ($)
    {
        $.fn.animateScrollIntoView = function (scrollRoot?: any)
        {
            var $scrollRoot = isSomething(scrollRoot) ? $(scrollRoot) : $('html, body');

            var offset = isSomething(scrollRoot) ?
                offsetTopRelativeTo(this, $scrollRoot) :
                this.offset().top;

            $scrollRoot.animate({
                scrollTop: offset - 25
            }, 500);

            return this;
        };
    } (jQuery));

offsetTopRelativeTo is a routine defined elsewhere like so, a top level function: offsetTopRelativeTo是一个在其他地方定义的例程,像这样,一个顶级 function:

funtion offsetTopRelativeTo(fromElement, toElement)
{...}

There's no use of ES6 code constructs here, and the transpilation to ES5 is identical to ES6.这里没有使用 ES6 代码结构,转译为 ES5ES6 相同。

When the ES5 version goes through NUglify, it yields当 ES5 版本通过 NUglify 时,它产生

    function(n)
    {
        n.fn.animateScrollIntoView = function(t)
        {
            var i = isSomething(t) ? n(t) : n("html, body"),
                r = isSomething(t) ? offsetTopRelativeTo(this, i) : this.offset().top;
            return i.animate({ scrollTop: r - 25 }, 500), this
        }
    }(jQuery);

Note that offsetTopRelativeTo is preserved.请注意,保留了offsetTopRelativeTo But when the exact same ES6 version is uglified, it mangles that function name to something like n .但是,当完全相同的ES6 版本被丑化时,它会将 function 名称破坏为类似n的名称。

This is breaking my code because other routines, outside of this file entirely, also call the function, which doesn't exist, because it's been mangled.这破坏了我的代码,因为完全在这个文件之外的其他例程也调用了 function,它不存在,因为它被破坏了。

Why would this be?为什么会这样?

(I know I can call Nuglify with PreserveFunctionNames and force it not to mangle the names, but for now I'm just trying to understand why this is happening, since the code is exactly the same between ES5 and ES6.) (我知道我可以用PreserveFunctionNames调用 Nuglify 并强制它不要破坏名称,但现在我只是想了解为什么会发生这种情况,因为代码在 ES5 和 ES6 之间完全相同。)

I figured out what is going on here.我明白这是怎么回事了。 The above sample didn't capture the larger context, which is that the above code is wrapped in a conditional:上面的示例没有捕获更大的上下文,即上面的代码被包裹在一个条件中:

if (typeof jQuery != 'undefined')
{
...all of the above code...
}

It appears that NUglify is detecting that the file is ES6 and also applying a different rule: if a function is nested in a conditional, it's safe to mangle it.看起来 NUglify 正在检测文件是 ES6 并且还应用了不同的规则:如果 function 嵌套在条件中,则可以安全地破坏它。

This seems like a dangerous assumption, but in my case the method probably shouldn't be local to that conditional, if I do in fact want to use it elsewhere, so I'll just move it outside.这似乎是一个危险的假设,但在我的情况下,该方法可能不应该是该条件的本地方法,如果我确实想在其他地方使用它,那么我将把它移到外面。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM