javascript - UglifyJS 不会破坏 TypeScript 生成的 JavaScript 中的函数名称

Question

我有一个简单的 TypeScript 类，我将其转换为 ES5，然后与 webpack 2 捆绑并使用 UgilfyJS3 最小化。

我希望 UgilfyJS 也会破坏函数名称 showGreeting() (参见下面的代码)，但在缩小的 js 文件中，事实并非如此。我是否可以设置任何其他选项来缩小函数名称，或者我是否在做一些磨损的事情？ 我知道变量名没有被破坏，但为什么函数名没有被破坏？

这是原始的 TypeScript 文件:

export class Greeter {
    constructor(greeting: string) {
        this.greeting = greeting;
    }

    greeting: string;
    showGreeting() {
        console.log(this.greeting);
    }
}

const myGreeter = new Greeter("hello, world");
myGreeter.greeting = "howdy";
myGreeter.showGreeting();

这是包含 UglifyJS 的 webpack.config:

const path = require('path');
const webpack = require('webpack');
const UglifyJSPlugin = require('uglifyjs-webpack-plugin');
module.exports = {
    entry: './test.ts',
    output: {
        filename: 'bundle.js',
        path: path.resolve(__dirname, 'dist')
    },
    devtool: "source-map",
    resolve: {
        extensions: ['.ts', '.tsx', '.js']
    },
    module: {
        loaders: [
          { test: /\.tsx?$/, loader: 'ts-loader' }
        ]
    },
    plugins: [
        new UglifyJSPlugin({
            mangle: {
                toplevel: true,
                eval: true
            }
        }), 
]
};

生成的输出 Javascript 包含以下行:

[function (e, t, r) {
            "use strict";
            Object.defineProperty(t, "__esModule", {
                value: !0
            });
            var n = function () {
                function e(e) {
                    this.greeting = e
                }
                return e.prototype.showGreeting = function () {
                    console.log(this.greeting)
                },
                e
            }
            ();
            t.Greeter = n;
            var o = new n("hello, world");
            o.greeting = "howdy",
            o.showGreeting()
        }
    ]);

Answer 1

类成员是对象属性，并且 UglifyJS 不会破坏属性名称。这是an explanation .

Google 的闭包编译器可以完成这项工作。但很难用，with limitations .