如何使用Google的Closure Compiler将我的javascript分成模块?

Nit*_*mer 18 javascript minify google-closure-compiler

我想在我们正在使用的javascript源代码上使用google封闭编译器.在开发模式中,我们倾向于将功能分解为大量文件,但是对于生产而言,它们希望将它们组合到模块中.

在调用编译器时,我可以给它一个要包含的文件列表进行编译,但是它的输出显示编译器没有保存文件列表的顺序.

我搜索了它,发现我可以使用goog.provide/good.require来控制不同js文件之间的依赖关系.问题在于它为我的js添加了我不需要或不想要的代码,例如:

goog.provide("mainFile")
Run Code Online (Sandbox Code Playgroud)

将添加这个:

var mainFile = {};
Run Code Online (Sandbox Code Playgroud)

到编译的js文件,我不想要的东西.我们根本没有使用谷歌闭包库,我想要使用的只是编译器.

有没有办法告诉编译器文件的顺序,而不包括我不需要的更多"闭包库"功能?我当然可以创建一个我自己的工具,它将首先获取所有文件,将它们组合成一个然后将成为编译器输入的文件,但如果它可以由编译器本身完成,我宁愿无效.


编辑

目标是能够像这个线程中的答案一样生成模块:使用Closure Compiler中的--module选项创建多个输出文件

所以我想补充一点,就是能够控制哪些文件进入哪个模块,同时控制他们的订单.现在我不使用通配符,但我计划将来这样做(如果可能的话).

简单地说"cat file1.js file2.js> combined.js && compile ..."很好,但在我们的例子中它有点复杂,我们必须编写一个基于某些逻辑来执行该操作的程序/脚本.如果我们能以某种方式告诉编译器高级文件的顺序,它可能只是节省实现这样一个程序的时间.

谢谢.

Cha*_*rth 37

Closure-compiler创建多个输出文件的能力提供了一个强大的工具,可以将输入文件分成不同的输出块.它被设计成可以根据所需的特征在不同的时间加载不同的块.有多个与块有关的编译器标志.

每次使用--chunk标志都会描述一个输出文件及其依赖项.每个块标志遵循以下语法:

--js inputfile.js
--chunk name:num_files:dependency
Run Code Online (Sandbox Code Playgroud)

生成的输出文件将是name.js,并包含前面的-js标志指定的文件.

依赖选项是您最感兴趣的选项.它指定父块的内容.块选项必须描述有效的依赖树(您必须具有基本块).

这是一个例子:

--js commonfunctions.js
--chunk common:1
--js page1functions.js
--js page1events.js
--chunk page1:2:common
--js page2function.js
--chunk page2:1:common
--js page1addons.js
--chunk page1addons:1:page1
Run Code Online (Sandbox Code Playgroud)

在这种情况下,您告诉编译器page1和page2块依赖于公共块,而page1addons块依赖于page1块.

请记住,如果编译器确定它仅由该块使用,则编译器可以并且确实将代码从一个块移动到其他块输出文件中.

这些都不需要闭包库或使用goog.require/provide调用,也不会在输出中添加任何代码.如果您希望编译器自动确定依赖关系或能够为您管理这些依赖关系,则需要使用模块格式,例如CommonJS,ES2015模块或goog.require/provide/module调用.

更新注意:在20180610版本之前,chunk标记已命名module.它们被重命名以减少与适当的JS模块的混淆.答案已更新,以反映新名称.

  • 投票.这是一个很好的简洁答案,有一个很好的例子.完善.在测试你的答案时,我无法创建名称中包含句点或破折号的模块.这可能,或者我做错了什么?示例:`--module common.min:1`对我不起作用.(当我说不起作用时,我的意思是没有创建模块.) (3认同)