How to use Google's Closure to compile JavaScript

Question

Google just released Closure, which is a compiler to minify JavaScript.

On the product site, it says "The Closure Compiler has also been integrated with Page Speed".

How do I use Page Speed to compile my web pages JavaScript with Closure?

(Or, is there a web site that I can simply paste in my JavaScript to have closure minify it?

Answer 1

For a single file it's simple

java -jar $path_to_jar/compiler.jar --js input_file.js \
          --js_output_file output_file.js

For a multi-file project you can use calcdeps.py in combination with the compiler.jar

#!/bin/sh$
$CALCDEPS_PATH=/path/to_calcdeps  #directory containing calcdeps.py
$JAR_PATH=/path/to_jar            #directory containing compiler.jar
$CLOSURE_PATH=/path/to_closure    #contains directory "closure"
$CALCDEPS_PATH/calcdeps.py --path $CLOSURE_PATH \
                           --path . \
                           --compiler_jar $JAR_PATH/compiler.jar \
                           --input main_project_file.js \
                           --output_mode compiled \
                           > compiled_project_file.js

That way compiler gives meaningful information about type errors, etc. Type errors can be caught at compile time because compiler.jar uses certain JSDoc comments for type information.

Extra compiler flags can be passed to calcdeps.py along with -f or --compiler_flags options

If you want to use advanced optimizations set

--compiler_flags "--compilation_level=ADVANCED_OPTIMIZATIONS"

notice the double quotes and the equal sign - had to use that format in bash

Answer 2

The Closure compiler is now available as a JavaScript application. No need for the Java dependency anymore

There are a few ways to integrate with it. I have done it as part of Rollup

ex:

import rollup from 'rollup';
import closure from 'rollup-plugin-closure-compiler-js';

export default {
  entry: 'index.js',
  dest: 'dist/build.js',
  format: 'iife',
  plugins: [
    closure({
      languageIn: 'ECMASCRIPT6',
      languageOut: 'ECMASCRIPT5',
      compilationLevel: 'ADVANCED',
      warningLevel: 'VERBOSE',
      externs: [{src:`
                      var jQuery;
                      jQuery.fadeIn = function() {};  

                      var ko;  
                      ko.applyBindings = function(vm) {};
                      ko.computed = function(a,b) {};
                      ko.observable = function(a) {};
               `}],
    })
  ]
}

More info here:

http://www.syntaxsuccess.com/viewarticle/using-the-closure-compiler---advanced_optimizations

Answer 3

"Page Speed 1.4 Beta integrates the Closure Compiler to minify JavaScript files automatically. However, you will need to download and install the Page Speed Beta and Closure Compiler separately."

http://code.google.com/speed/page-speed/download.html

I haven't installed this version yet, but I'm fairly certain that Page Speed will present you with compiled code in its optimization recommendations.

Answer 4

It seems that Closure Compiler is integrated with Page Speed only for Windows.

Answer 5

Use the closure compiler with PHP (hosted via CURL or local via command line tool)

http://bohuco.net/blog/2009/11/google-closure-compiler-with-php/

Answer 6

If you need to compile multiple js files or if you would like to simplify compilation process, you may use kjscompiler: https://github.com/knyga/kjscompiler (based on google closure compiler)