javascript - 如何使用闭包编译器从另一个压缩文件中获取变量
问题描述
您好,我想通过 Google 集成 Closure 编译器以使用 ADVANCED_OPTIMIZATIONS 模式压缩我的文件,但我有 2 个压缩文件,我需要在两者之间共享变量。
我阅读了这份文档https://developers.google.com/closure/compiler/docs/api-tutorial3
问题
我收到了这个错误:
ReferenceError:getValue 未定义
所以我试图用 window['getValue'] 替换 getValue 但它不起作用。
基本代码
第一个 JS 文件:
var nb0 = 0;
var nb1 = 1;
var nb2 = 2;
var nb3 = 3;
function getValue( nb ) {
return nb;
}
window['nb0'] = nb0;
window['nb1'] = nb1;
window['nb2'] = nb2;
window['nb3'] = nb3;
window['getValue'] = getValue;
第二个 JS 文件:
document.addEventListener("DOMContentLoaded", function() {
var val = getValue;
document.querySelector( ".button" ).addEventListener( "click", upButton );
function upButton() {
val++;
document.querySelector( ".show" ).innerText = val;
}
} );
解决方案
此问题的解决方案在您链接的文档中的从编译代码调出到外部代码的子标题下说明(如果简短的话) :外部代码。
我想您的困惑来自“第三方”和“外部”这两个词。在本文档的上下文中,您可以假设“第三方”和“外部”既指由他人编写的代码,也指来自单独编译的任何文件(由您或他人)的任何代码。
然后解决方案是预先/** @export */
添加到您希望不重命名的变量,或者为您的源定义一个externs文件。
备选 1
如果您希望以这种方式继续使用window
(它可能很难看,恕我直言,有时这是合适的),您应该更改
var val = getValue;
至
var val = window['getValue'];
例如:
document.addEventListener("DOMContentLoaded", function() {
var val = window['getValue'];
document.querySelector( ".button" ).addEventListener( "click", upButton );
function upButton() {
val++;
document.querySelector( ".show" ).innerText = val;
}
} );
编译为
document.addEventListener("DOMContentLoaded", function() {
var a = window.getValue;
document.querySelector(".button").addEventListener("click", function() {
a++;
document.querySelector(".show").innerText = a;
});
});
备选 2
使用ES6 模块。闭包编译器通过标志支持这些module_resolution
。
一般阅读:用模块封装代码 :
备选 3
使用Google Closure 库的模块(goog.module、goog.require 和(已弃用)goog.provide)。
推荐阅读
- python - 如何获取它以便它 fill_between 获取所有区域,直到 y 达到 0 而不是仅填充有多个 y=1 值的实例
- android - 如何在运行 android Q 及以下的设备中获得与 LAYOUT_IN_DISPLAY_CUTOUT_MODE_ALWAYS 相同的功能?
- python-3.x - 文件夹中的 inspect.py 文件使导入 pandas 不再起作用
- python - 忽略元素的递归函数 - python
- javascript - 为什么卸载组件时没有移除 react 样式?
- javascript - 将响应字符串转换为对象
- c# - 如何在 WPF 中播放一帧动画?
- consul - 使用游牧作业为领事服务网格配置异常值检测
- javascript - 使用 AJAX get 方法从具有额外加载的页面中检索数据
- javascript - Fetch Post a number server body undefined