closure-webpack-plugin

closure-webpack-plugin

This plugin supports the use of Google's Closure Tools with webpack.

Closure-Compiler is a full optimizing compiler and transpiler. It offers unmatched optimizations, provides type checking and can easily target transpilation to different versions of ECMASCRIPT.

Closure-Library is a utility library designed for full compatibility with Closure-Compiler.

Usage example

const ClosurePlugin = require('closure-webpack-plugin');

new ClosurePlugin({mode: 'STANDARD'}, {
  // compiler flags here
  //
  // for debuging help, try these:
  //
  // formatting: 'PRETTY_PRINT'
  // debug: true
})

Options

• platform - native, java or javascript. Controls which version to use of closure-compiler. By default the plugin will attempt to automatically choose the fastest option available.

  • JAVASCRIPT does not require the JVM to be installed. Not all flags are supported.
  • JAVA utilizes the jvm. Utilizes multiple threads for parsing and results in faster compilation for large builds.
  • NATIVE only available on linux or MacOS. Faster compilation times without requiring a JVM.

• mode - STANDARD (default), AGGRESSIVE_BUNDLE or NONE. Controls how the plugin utilizes the compiler.

  • STANDARD mode, closure-compiler is used as a direct replacement for other minifiers as well as most Babel transformations.
  • AGGRESSIVE_BUNDLE mode, the compiler performs additional optimizations of modules to produce a much smaller file, but is not compatible with all input modules.
  • NONE is designed for dev mode without the compiler but still supports closure-library style dependencies.

• childCompilations - boolean or function. Defaults to false. In order to decrease build times, this plugin by default only operates on the main compilation. Plugins such as extract-text-plugin and html-webpack-plugin run as child compilations and usually do not need transpilation or minification. You can enable this for all child compilations by setting this option to true. For specific control, the option can be set to a function which will be passed a compilation object.
  Example: function(compilation) { return /html-webpack/.test(compilation.name); }.

• closureLibraryBase - (optional) string. Path to the base.js file in Closure-Library.

• deps - (optional) string or Array. Closures style dependency mappings. Typically generated by the depswriter.py script included with Closure-Library.

• extraDeps - (optional) Object. Mapping of namespace to file path for closure-library provided namespaces.

Compiler Flags

The plugin controls several compiler flags. The following flags should not be used in any mode:

• module_resolution
• output_wrapper
• dependency_mode
• create_source_map
• module
• entry_point

Aggressive Bundle Mode

In this mode, the compiler rewrites CommonJS modules and hoists require calls. Some modules are not compatible with this type of rewritting. In particular, hoisting will cause the following code to execute out of order:

const foo = require('foo');
addPolyfillToFoo(foo);
const bar = require('bar');

Aggressive Bundle Mode utilizes a custom runtime in which modules within a chunk file are all included in the same scope. This avoids the cost of small modules.

In Aggressive Bundle Mode, a file can only appear in a single output chunk. Use the Commons Chunk Plugin to split duplicated files into a single output chunk.

Tips for Use

• Don't use babel - closure-compiler is also a transpiler. If you need features not yet supported by closure-compiler, have babel only target those features.

Maintainers

Chad Killingsworth

Joshua Wiens