Minifying ionic.bundle.js file

ionic-v1
1

Hi,

As part of our project we have made some custom changes in the ionic.bundle.js file we are using.

We now want to minify the js file using yuicompressor. However, the compression is failing though the dependency injection is correct in ionic.bundle.js (verified by running ng-annotate tool).

Here are the console logs we are getting when we try to minify ionic.bundle.js (version 1.0.0-beta.6)

java -jar yuicompressor-2.4.8.jar www/vendor/ionic/js/ionic.bundle.mymin.js
[ERROR] in www/vendor/ionic/js/ionic.bundle.mymin.js
9165:11:identifier is a reserved word
[ERROR] in www/vendor/ionic/js/ionic.bundle.mymin.js
9165:21:illegal character
[ERROR] in www/vendor/ionic/js/ionic.bundle.mymin.js
9165:23:syntax error
[ERROR] in www/vendor/ionic/js/ionic.bundle.mymin.js
9167:13:identifier is a reserved word
[ERROR] in www/vendor/ionic/js/ionic.bundle.mymin.js
9167:24:illegal character
[ERROR] in www/vendor/ionic/js/ionic.bundle.mymin.js
9167:26:syntax error
…
…

[ERROR] in www/vendor/ionic/js/ionic.bundle.mymin.js
1:0:Compilation produced 52 syntax errors.
org.mozilla.javascript.EvaluatorException: Compilation produced 52 syntax errors.
at com.yahoo.platform.yui.compressor.YUICompressor$1.runtimeError(YUICompressor.java:172)
at org.mozilla.javascript.Parser.parse(Parser.java:396)
at org.mozilla.javascript.Parser.parse(Parser.java:340)
at com.yahoo.platform.yui.compressor.JavaScriptCompressor.parse(JavaScriptCompressor.java:315)
at com.yahoo.platform.yui.compressor.JavaScriptCompressor.(JavaScriptCompressor.java:536)
at com.yahoo.platform.yui.compressor.YUICompressor.main(YUICompressor.java:147)
at sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
at sun.reflect.NativeMethodAccessorImpl.invoke(NativeMethodAccessorImpl.java:57)
at sun.reflect.DelegatingMethodAccessorImpl.invoke(DelegatingMethodAccessorImpl.java:43)
at java.lang.reflect.Method.invoke(Method.java:606)
at com.yahoo.platform.yui.compressor.Bootstrap.main(Bootstrap.java:21)

We want to know how this error can be fixed.
Any pointers will be helpful. Thanks in advance!

2

So that would require going back and annotating all the code.

Ideally, you shouldn’t be changing the bundle.js file, as this will change with each new release of ionic. So I’d suggest pulling those changes out and using them as separate modules.

But if that is not an option…

3

Hi,

I did used ng-annotate on the ionic bundle js to correct dependency injection and then tried to minify using YUICompressor but the errors remained. So I used google closure compiler with the langauage-in option set to ECMAScript 5 and it worked.

I dont think if ng-annotate can be used for minification too, please advise if this is wrong.

4

Ng-annotate actually does minification as well. You just need to pass a flag to it.
But again, I’d strongly suggest you move any edits you make to out side of the ionic src so that way it is not over written with the new updates

5

I have a question regarding bundle.js and bundle.min.js. Bundle takes about 1.5MB so it makes sense rather to include the min version,

<script src="lib/ionic/js/ionic.bundle.min.js"></script>

but it throws me this erros in the Dev Console:

   Uncaught SyntaxError: Unexpected token : ionic.bundle.min.js:22
6

I overwritten it with http://code.ionicframework.com/1.0.0-beta.13/js/ionic.bundle.min.js and now it works.