闭包编译器和奇怪的前置代码
Closure-compiler and strange pre code
我经常使用在线闭包编译器 (https://closure-compiler.appspot.com/home) 来压缩我的 JS 代码。现在,我正尝试通过 "External tools" 将此过程集成到 PhpStorm 中,结果非常奇怪。一切正常,除了一件事 - 如果我使用 Set 变量,一些奇怪的代码会在我之前打印出来。例如:
原代码:
function a(text) { alert(text); }
$(document).ready(function(){
let mySet = new Set();
$("#myButton").click(function(){
a("CLICKED");
mySet.clear();
for(let i=0;i<10;i++) mySet.add(i);
});
});
通过网络工具缩小:
function a(b){alert(b)}$(document).ready(function(){var b=new Set;$("#myButton").click(function(){a("CLICKED");b.clear();for(var c=0;10>c;c++)b.add(c)})});
通过命令行缩小 (java -jar compiler.jar --charset UTF-8 --js closureTest.js --js_output_file closureTest.min.js): https://pastebin.com/QqGXc6H7
没有设置变量:
原:
function a(text) { alert(text); }
$(document).ready(function(){
let mySet = [];
$("#myButton").click(function(){
a("CLICKED");
mySet.length = 0;
for(let i=0;i<10;i++) mySet.push(i);
});
});
通过网络工具缩小:
function a(b){alert(b)}$(document).ready(function(){var b=[];$("#myButton").click(function(){a("CLICKED");for(var c=b.length=0;10>c;c++)b.push(c)})});
通过命令行缩小:
function a(b){alert(b)}$(document).ready(function(){var b=[];$("#myButton").click(function(){a("CLICKED");for(var c=b.length=0;10>c;c++)b.push(c)})});
如你所见,WEB-tool编译可以,但是命令行编译有什么问题?
嗯,我找到了解决方案(感谢 shiftweave)。
它需要参数 --rewrite_polyfills false
才能正常工作。
编译器默认 "transpiles" 从支持的最新语言版本到 EcmaScript 5 的代码。为了支持这一点,它还包括必要的 polyfill。如果您不需要 polyfill,另一个答案中所述的 --rewrite_polyfills false
是一种解决方案,但更好的解决方案可能是设置 --language_out=ECMASCRIPT_2015
或 --language_out=ECMASCRIPT_2017
如果您只针对支持的浏览器这些后来的语言特征。
您应该设置您想要的--language_out
,因为默认值将来可能会改变。
我经常使用在线闭包编译器 (https://closure-compiler.appspot.com/home) 来压缩我的 JS 代码。现在,我正尝试通过 "External tools" 将此过程集成到 PhpStorm 中,结果非常奇怪。一切正常,除了一件事 - 如果我使用 Set 变量,一些奇怪的代码会在我之前打印出来。例如:
原代码:
function a(text) { alert(text); }
$(document).ready(function(){
let mySet = new Set();
$("#myButton").click(function(){
a("CLICKED");
mySet.clear();
for(let i=0;i<10;i++) mySet.add(i);
});
});
通过网络工具缩小:
function a(b){alert(b)}$(document).ready(function(){var b=new Set;$("#myButton").click(function(){a("CLICKED");b.clear();for(var c=0;10>c;c++)b.add(c)})});
通过命令行缩小 (java -jar compiler.jar --charset UTF-8 --js closureTest.js --js_output_file closureTest.min.js): https://pastebin.com/QqGXc6H7
没有设置变量:
原:
function a(text) { alert(text); }
$(document).ready(function(){
let mySet = [];
$("#myButton").click(function(){
a("CLICKED");
mySet.length = 0;
for(let i=0;i<10;i++) mySet.push(i);
});
});
通过网络工具缩小:
function a(b){alert(b)}$(document).ready(function(){var b=[];$("#myButton").click(function(){a("CLICKED");for(var c=b.length=0;10>c;c++)b.push(c)})});
通过命令行缩小:
function a(b){alert(b)}$(document).ready(function(){var b=[];$("#myButton").click(function(){a("CLICKED");for(var c=b.length=0;10>c;c++)b.push(c)})});
如你所见,WEB-tool编译可以,但是命令行编译有什么问题?
嗯,我找到了解决方案(感谢 shiftweave)。
它需要参数 --rewrite_polyfills false
才能正常工作。
编译器默认 "transpiles" 从支持的最新语言版本到 EcmaScript 5 的代码。为了支持这一点,它还包括必要的 polyfill。如果您不需要 polyfill,另一个答案中所述的 --rewrite_polyfills false
是一种解决方案,但更好的解决方案可能是设置 --language_out=ECMASCRIPT_2015
或 --language_out=ECMASCRIPT_2017
如果您只针对支持的浏览器这些后来的语言特征。
您应该设置您想要的--language_out
,因为默认值将来可能会改变。