PDA

View Full Version : Javascript minification



bkraut
11 Sep 2009, 6:32 AM
Hi,

I'm wandering how to minify javascript in repeated process - let say in you have to release updates of the application twice a week - how is the best way to minify written extjs code.

I had used before a tool JS Text File Merger, where I created one single file and then I minified this file to one single file. I had 15 javascript files.

Today we have some 500 files in different directories. Is there any build.xml option to autocreate minified releases or should we write our own?

Best regards,
Bojan

Condor
11 Sep 2009, 6:37 AM
Use JSBuilder2 (http://www.extjs.com/products/jsbuilder/).

babsjr77
11 Sep 2009, 9:30 AM
There is also https://jawr.dev.java.net/

bkraut
13 Sep 2009, 2:10 AM
Condor Jsbuilder2 is running inside Eclipse? How is with CVS, Subversion support. How is with backand programming support?

https://jawr.dev.java.net/ is very promissing, I'll take a look more carefully. Thanks.

Anyway I'm interested in the eclipse environment, or Aptana.

Condor
13 Sep 2009, 8:08 AM
I haven't used it myself, but for Eclipse you could also try jsLex (http://www.rockstarapps.com/joomla-1.5.8/products/jslex-web-optimizer.html).

bkraut
14 Sep 2009, 1:36 AM
Perfect. I'll givi it a try.

blex2010
8 Dec 2010, 6:40 AM
Hi, I don't know java, I tried running it but I don't know how to get all the libraries and get them working with it. Is there a more remedial build instruction or a different tool I could use?

Condor
8 Dec 2010, 6:56 AM
JSBuilder2 comes with all the libraries included. You shouldn't need anything more than an installed JRE to follow the JSBuilder2 instructions.

Screamy
8 Dec 2010, 7:25 AM
I drop YUICompressor.jar (http://developer.yahoo.com/yui/compressor/) and YUIAnt.jar (http://www.ubik-ingenierie.com/ubikwiki/index.php?title=Minifying_JS/CSS) into a /config folder at the root of my Eclipse project and reference them under Eclipse's Ant -> Runtime -> Global Entries. I drop a custom Ant build script (and build.properties) in the root of my project where the script compiles the Java source, compresses JS files on the fly and builds a WAR. I also integrated Tomcat's Catalina Ant tasks so that the script stops/undeploys/deploys the WAR to a DEV Linux box only after a clean build.

If interested, here's my build.properties:



# I point to a local Tomcat to satisfy JEE imports and for Catalina ANT tasks.
TOMCAT.HOME=c:/program files (x86)/apache-tomcat-6.0.29
# The remote instance to which I deploy
TOMCAT.MANAGER.URL=http://webserver:8080/manager
# Remote instance credentials
TOMCAT.USER=screamy
TOMCAT.PASSWORD=s00perD00perPassword
And the build.xml:



<project name="WAR-Name-Here" default="deploy" basedir=".">
<description>App build and deploy script.</description>
<!--
This build script relies on build.properties which identifies the
various bits of info needed to deploy your application:

1.) TOMCAT.HOME=/path/to/tomcat

This property specifies Tomcat's root directory.

2.) TOMCAT.MANAGER.URL=http://somehost:8080/manager

This is the URL of the Tomcat instance on which your app will be deployed.

3.) TOMCAT.USER=<a tomcat user name with privileges to deploy/undeploy apps>

The value of this property must be the name of a tomcat user with sufficient
privileges to stop/undeploy/deploy your application.

4.) TOMCAT.PASSWORD=<the password of the tomcat user>

The value of this property should be the password of the tomcat.user specified.
-->

<property file="build.properties" />

<!-- These properties are echoed for informational/debug purposes. -->
<echo>TOMCAT.HOME target: ${TOMCAT.HOME}</echo>
<echo>TOMCAT.MANAGER.URL target: ${TOMCAT.MANAGER.URL}</echo>
<echo>Ant Project Name: ${ant.project.name}</echo>

<!-- folders used during build -->
<property name="config.dir" location="config" />
<property name="src.dir" location="src" />
<property name="build.dir" location="build" />
<property name="dist.dir" location="dist" />
<property name="yuicompressor.dir" location="config/compressor" />

<!-- Sets the class path so that the Java compiler can find the application's JAR files. -->
<path id="build.classpath">
<fileset dir="WebContent/WEB-INF/lib" includes="**/*.jar" />
</path>

<path id="yuicompressor.classpath">
<fileset dir="${yuicompressor.dir}">
<include name="**/yuicompressor-2.4.2.jar" />
<include name="**/YUIAnt.jar" />
<!-- <include name="**/rhino*.jar"/> -->
</fileset>
</path>

<!-- Register Tomcat Ant tasks. -->
<taskdef name="stop" classname="org.apache.catalina.ant.StopTask">
<classpath>
<pathelement path="${TOMCAT.HOME}/lib/catalina-ant.jar" />
</classpath>
</taskdef>

<taskdef name="undeploy" classname="org.apache.catalina.ant.UndeployTask">
<classpath>
<pathelement path="${TOMCAT.HOME}/lib/catalina-ant.jar" />
</classpath>
</taskdef>

<taskdef name="deploy" classname="org.apache.catalina.ant.DeployTask">
<classpath>
<pathelement path="${TOMCAT.HOME}/lib/catalina-ant.jar" />
</classpath>
</taskdef>

<taskdef name="yuicompress" classname="com.yahoo.platform.yui.compressor.YUICompressTask">
<classpath>
<path refid="yuicompressor.classpath" />
</classpath>
</taskdef>


<!-- Clean target folders -->
<target name="clean" description="clean up">
<delete dir="${dist.dir}" />
<delete dir="${build.dir}" />
</target>


<!-- init target takes care of creating any required folders. -->
<target name="init" depends="clean">
<mkdir dir="${dist.dir}" />
<mkdir dir="${build.dir}/WEB-INF/lib" />
<mkdir dir="${build.dir}/WEB-INF/classes" />
<mkdir dir="${build.dir}/META-INF" />
</target>


<!-- Compile the source, adding a classpath reference to Tomcat's server-api.jar
file so that JEE dependencies are satisfied.-->
<target name="compile" depends="init" description="Compiles Java source ">
<javac debug="off" srcdir="${src.dir}" destdir="${build.dir}/WEB-INF/classes">
<classpath refid="build.classpath" />
<classpath>
<pathelement path="${TOMCAT.HOME}/lib/servlet-api.jar" />
</classpath>
</javac>

<!-- This copies any non-Java files which exist in the source folders. If using Struts,
you'll have a resource properties file which is homed somewhere in the source folders. -->
<copy todir="${build.dir}/WEB-INF/classes">
<fileset dir="${config.dir}">
<include name="*.properties" />
</fileset>
</copy>

<copy todir="${build.dir}">
<fileset dir="WebContent">
<exclude name="**/web.xml" />
</fileset>
</copy>

</target>



<target name="minify" depends="compile" description="Minifiy a set of files">
<yuicompress linebreak="300" warn="false" munge="true" preserveallsemicolons="true" outputfolder="${build.dir}/js">
<fileset dir="WebContent/js/">
<include name="**/*.js" />
<exclude name="ext/" />
</fileset>
</yuicompress>
</target>



<!-- dist target creates the distribution for your app; in this case, a WAR file. -->
<target name="dist" depends="minify" description="Generates a WAR file for your app.">
<!-- The WAR file will be written to the root of your Eclipse project is no path is specified
in the destfile attribute. -->
<war destfile="${dist.dir}/${ant.project.name}.war" webxml="WebContent/WEB-INF/web.xml">
<!-- This copies the complete set of files/folders under WebContent into the root of
the WAR file. -->
<fileset dir="${build.dir}" />

<classes dir="${build.dir}/WEB-INF/classes" />

<!-- This places the application's context.xml into the META-INF folder of the WAR file.
<metainf file="${build}/context.xml" />
-->
</war>
</target>



<target name="stop" depends="dist" description="Undeploys application to target server.">
<stop failOnError="false" url="${TOMCAT.MANAGER.URL}" username="${TOMCAT.USER}" password="${TOMCAT.PASSWORD}" path="/${ant.project.name}" />
</target>


<target name="undeploy" depends="stop" description="Undeploys application to target server.">
<undeploy failOnError="false" url="${TOMCAT.MANAGER.URL}" username="${TOMCAT.USER}" password="${TOMCAT.PASSWORD}" path="/${ant.project.name}" />
</target>

<target name="deploy" depends="undeploy" description="Deploys application to target server.">
<deploy url="${TOMCAT.MANAGER.URL}" username="${TOMCAT.USER}" password="${TOMCAT.PASSWORD}" path="/${ant.project.name}" war="file:${dist.dir}/${ant.project.name}.war" />
</target>

</project>

blex2010
9 Dec 2010, 7:08 AM
JSBuilder2 comes with all the libraries included. You shouldn't need anything more than an installed JRE to follow the JSBuilder2 instructions.

I ran the script as specified and this is what happened (again with very little java experience):

C:\JSBuilder2>java -jar JSBuilder2.jar --projectFile Z:\pd\PlanSetup.jsb2 --homeDir Z:\pd\

Exception in thread "main" java.lang.NoClassDefFoundError: com/extjs/JSBuilder2
Could not find the main class: com.extjs.JSBuilder2. Program will exit.


NOTE: I ran this from the directory where I unzipped the JSBuilder2.zip download file. The jar is there.

KallDrexx
9 Dec 2010, 7:18 AM
I know in this case you don't use Visual Studio, but in case anyone here besides me uses Visual Studio and does need JS minification (and concatenation) a good solution is Chirpy (http://chirpy.codeplex.com/). I use it, and every time I modify my javascript, once I save the file it automatically generates a single JS file with all my javascript files concatenated, and it also generates a minified version of that concatenation.

blex2010
16 Dec 2010, 5:56 AM
So I can't get this working on the command line - keep getting the same error and haven't found any solutions while searching. Since I don't use eclipse or visual studio is there any other recommended mnification solution?

Thanks!