在使用 Google 的 Closure 转译 JavaScript 时，如何使用类作为名称空间？

如何解决在使用 Google 的 Closure 转译 JavaScript 时，如何使用类作为名称空间？

我正在使用 ADVANCED_OPTIMIZATIONS 改编一些 JavaScript 代码，以便在 Google 的闭包中进行转译。我使用 class 作为命名空间：

class MySpiffyClass {
    ...
}

该类包含方法和静态“字段”，包括许多其他类。 .js 文件中的所有内容都包含在此类中。展望未来，将会有大约 10 个其他 .js 文件，每个文件都以类似的方式包含自己的类。 HTML 文档可能会使用这些文件中的一个或多个，而我无法控制使用哪些文件。我不希望它们中的任何一个相互干扰——因此需要命名空间。

当我转译时，我在生成的代码中看不到对我的类 MySpiffyClass 的引用。我必须假设 Closure 不符合我的意愿。我尝试将 export 添加到我的类定义行，但它似乎没有任何效果。任何帮助将不胜感激——我是 Closure 的新手，大多数文档都没有提到在代码中使用类。

附录——这是文件 demo.js 的最小版本：

class MySpiffyClass {
    static go() {
        window.alert("we're running! " + MySpiffyClass.someValue);
    }
}

MySpiffyClass.someValue = 3;
window.addEventListener('load',MySpiffyClass.go,false);

以及运行它的 HTML 文件：

<html lang="en">
    <head>
        <title>Basic Demo</title>
        <script src="demo.js"></script>
    </head>
    <body>  
        <p>Hello.</p>
    </body>
</html>

解决方法

当我转译时，我在结果代码中看不到对我的类 MySpiffyClass 的引用。

这听起来好像编译器已经修改了所有在高级编译模式下可能发生的名称，如果您没有提供 externs 文件。

这是我能想到的最小的可重现案例：
（cc 只是调用我的编译器的别名。）

// tmp/repro.js
window.MySpiffyClass = class {}

bash-5.0# cc --compilation_level ADVANCED_OPTIMIZATIONS --language_in ECMASCRIPT_NEXT --js tmp/repro.js
window.g=function(){};

你可以看到编译器已经修改了类名。

您可以使用 externs 文件来避免这种情况，该文件是编译器不应重命名的符号列表：

// tmp/externs.js
var MySpiffyClass;

bash-5.0# cc --compilation_level ADVANCED_OPTIMIZATIONS --language_in ECMASCRIPT_NEXT --js tmp/repro.js --externs tmp/externs.js 
window.MySpiffyClass=function(){};

在使用 Google 的 Closure 转译 JavaScript 时，如何使用类作为名称空间？

如何解决在使用 Google 的 Closure 转译 JavaScript 时，如何使用类作为名称空间？

解决方法

相关推荐