如何使用Google的Closure Compiler将我的javascript分成模块？ [英] How do I split my javascript into modules using Google's Closure Compiler?

问题描述

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

I want to use the google closure compiler on the javascript source we're using. In development mode we tend to break functionality to lots of files but for production would like to have them combined into modules.

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

When calling the compiler I can give it a list of files to include for compilation, but the output of that shows that the compiler did not save the order of the files list.

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

I searched about it and found that I can use goog.provide/good.require in order to control the dependencies between the different js files. The problem with that is that it adds code to my js which I just don't need or want, for example:

goog.provide("mainFile")

将添加：

var mainFile = {};

到已编译的js文件，这是我不想要的。
我们根本没有使用谷歌闭包库，我想要使用的只是编译器。

to the compiled js file, something that I don't want. We're not using the google closure library at all, all I want to use is the compiler.

有没有办法告诉编译器命令没有包含更多封闭库功能的文件，我不需要它？
我当然可以创建一个我自己的工具，它将首先获取所有文件，将它们组合成一个然后将成为编译器输入的文件，但是如果它可以由编译器本身。

Is there a way to tell the compiler the order of the files without including more "closure library" functionality which I have no need for? I can of course create a tool of my own which will first take all the files, combine them into one which will then be the input of the compiler, but I would prefer to void that if it can be done by the compiler itself.

目标是成为能够在这个帖子中生成类似答案的模块：使用Closure Compiler中的--module选项创建多个输出文件

The goal is to be able to produce modules like the answer in this thread: Using the --module option in Closure Compiler to create multiple output files

所以我想添加一下控制哪些文件的能力进入哪个模块，同时控制他们的订单。
现在我不使用通配符，但我打算将来这样做（如果可能的话）。

And so I want to add to that the ability to control which files go into which module while also having control on their order. For now I don't use wildcards, but I plan to do so in the future (if it's possible).

只需cat file1.js file2 .js> combined.js&& compile ...很好，但在我们的例子中它有点复杂，我们必须编写一个程序/脚本，根据一些逻辑来做。
如果我们能以某种方式告诉编译器高级文件的顺序，它可能只是节省实现这样一个程序的时间。

simply "cat file1.js file2.js > combined.js && compile..." is fine, but in our case it's a bit more complicated and we'll have to write a program/script that does that based on some logic. If we can somehow tell the compiler the order of the files in advanced it might just save the time of implementing such a program.

谢谢。

推荐答案

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

Closure-compiler's ability to create multiple output files provides a powerful tool to separate input files into distinct output chunks. It is designed such that different chunks can be loaded at differing times depending on the features required. There are multiple compiler flags pertaining to chunks.

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

Each use of the --chunk flag describes an output file and it's dependencies. Each chunk flag follows the following syntax:

--js inputfile.js
--chunk name:num_files:dependency

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

The resulting output file will be name.js and includes the files specified by the preceding --js flag(s).

依赖选项是您最感兴趣的选项。它指定父组块是什么。块选项必须描述有效的依赖树（你必须有一个基本块）。

The dependency option is what you will be most interested in. It specifies what the parent chunk is. The chunk options must describe a valid dependency tree (you must have a base chunk).

这是一个例子：

--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

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

In this case, you are telling the compiler that the page1 and page2 chunks depend on the common chunk and that the page1addons chunk depends on the page1 chunk.

请记住，编译器可以并确实将代码从一个块移动到其他块输出文件中它仅由该块使用。

Keep in mind that the compiler can and does move code from one chunk into other chunk output files if it determines that it is only used by that chunk.

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

None of this requires closure-library or the use of goog.require/provide calls nor does it add any code to your output. If you want the compiler to determine dependencies automatically or to be able to manage those dependencies for you, you'll need to use a module format such as CommonJS, ES2015 modules or goog.require/provide/module calls.

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

Update Note: Prior to the 20180610 version, the chunk flags were named module. They were renamed to reduce confusion with proper JS modules. The answer has been updated to reflect the new names.

这篇关于如何使用Google的Closure Compiler将我的javascript分成模块？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！