1. #1
    Ext User
    Join Date
    Apr 2008
    Posts
    14
    Vote Rating
    0
    StevenJ is on a distinguished road

      0  

    Default JSBuilder2 bugs

    JSBuilder2 bugs


    Hi Folks,
    JSBuilder2 is an elegant little tool, thanks for putting it out there. With ext-doc built in, it will feel complete. While building my own project I noticed two things that I didn't see addressed in this forum:
    1) The compilation is relative to the projectFile regardless of what you specify in homeDir. Failure to put a full path to the projectFile caused nulls to be prepended to the relative file locations.
    2) Compiling CSS files doesn't minify them or remove comments. I assume you know about this because the Ext 3.0 CSS files are no longer minified, but it brings up the question of whether we can set custom options on the yuicompressor embedded in this tool?

    Thx,
    Steve

  2. #2
    Sencha - Community Support Team Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,246
    Vote Rating
    97
    Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of

      0  

    Default


    1. The homeDir specifies the containing directory for the output files. It has nothing to do with the source files. I don't see a big problem with using relative paths in ext.jsb2 or requiring a full path for projectFile.

    2. Good point. I also wondered why .css files were no longer compressed. And I also would like to be able to specify (override) YUI compressor options.

  3. #3
    Ext User
    Join Date
    Apr 2008
    Posts
    14
    Vote Rating
    0
    StevenJ is on a distinguished road

      0  

    Thumbs up


    Condor wrote:
    > I don't see a big problem with using relative paths in ext.jsb2 or requiring a
    > full path for projectFile.
    Yes, as long as a relative directory is specified with '.' it's fine:
    Code:
    --projectFile .\build.jsb2
    3) Also, copying a resource folder which contains subfolders fails. Here I try to copy the all my ext files with one command and it fails:
    Code:
       resources: [{
            src: 'resources/lib/ext/',
            dest: 'resources/lib/ext/',
            filters: '.*'
        }]
    It works if the folder structure exists already.

  4. #4
    Ext User marcus.schiesser's Avatar
    Join Date
    Dec 2008
    Posts
    11
    Vote Rating
    0
    marcus.schiesser is on a distinguished road

      0  

    Default


    I totally agree with Steven

    Code:
    --projectFile ./build.jsb2
    does work but

    Code:
    --projectFile build.jsb2
    does not (result is FileNotFoundException because of a 'null' value is prepended to each file path).
    So that's a bug (Took me hours to find the solution - so I am a bit annoyed.)

    Also I found another issue (which fortunately did not take hours):

    In the JSON config it is necessary to append trailing slashes to each path, otherwise the files are not found. So

    Code:
    {
                text: 'foo.js',
                path: 'js/bar/'
    }
    does work for js/bar/foo.js, but

    Code:
    {
                text: 'foo.js',
                path: 'js/bar'
    }
    does not.

    So the tool is great but it should be less error-prone.

  5. #5
    Ext User
    Join Date
    Jul 2009
    Posts
    14
    Vote Rating
    0
    Niels Brouwers is on a distinguished road

      0  

    Default


    The compilation is relative to the projectFile regardless of what you specify in homeDir. Failure to put a full path to the projectFile caused nulls to be prepended to the relative file locations.
    This! It took me half an hour to figure out exactly what was happening. In the process, I found and fixed the bug:

    Code:
    private static void openProjectFile(String projectFileName) {
        try {
            File inputFile = new File(projectFileName);
            projectHome = inputFile.getParent();
    
            // ... snip ...    
        }
        catch (Exception e) {
            System.err.println(e.getMessage());
            System.err.println("Failed to open project file.");
        }
    }
    This should of course be something like this:

    Code:
    File inputFile = new File(projectFileName);
    projectHome = inputFile.getAbsoluteFile().getParent();
    For people who want to patch their JSBuilder2, I wrote a quick ANT build file that should re-build it for you.

    1. Download JSBuilder2.jar and unzip it somewhere
    2. Stick the appended build.xml in the same directory
    3. Patch the code in com/extjs/JSBuilder2.java
    4. Type `ant rebuild`
    5. ???
    6. Profit!
    Attached Files

  6. #6
    Ext JS Premium Member
    Join Date
    May 2008
    Posts
    528
    Vote Rating
    0
    Eric24 is on a distinguished road

      0  

    Default


    +1 on the ability to override YUI compressor options.

    Is there any information available on what YUI options JSBuilder2 uses?

  7. #7
    Sencha User
    Join Date
    Feb 2011
    Posts
    10
    Vote Rating
    2
    Beeaar is on a distinguished road

      1  

    Default Your wish...

    Your wish...


    Here is a version of JSBuilder2 with a few added features:
    - Supports compressing CSS files
    - Supports the full array of YUI options
    - Supports something I'll call Header Collapse for removal of redundant headers
    - Supports overriding the package deploy name
    - Fixes correct top level header perservation on CSS compression
    - Adds Encoding and Line Ending sanity and conversion with Proper BOM handling
    - Adds Sencha style Comment stripping
    - Adds Command line package and file/folder filtering.
    - Adds Deployment release building
    - Improved Build Time Performance

    Downloads:
    JSBuilder-2.0.3.zip
    JSBuilder-2.0.3-Readme (--stripComments --removeTempPkg --removeFilter --deployMode )

    JSBuilder-2.0.1.zip (original contrib)
    JSBuilder-2.0.2.zip (--deployDir --forceEncoding --forceLineEnd, correct BOM support, full encoding support)

    This is use at your own risk and not responsible for harm that may cause.. blah blah. This is not supported by me, or I imagine Sencha until they state otherwise. I claim no ownership of the code, distribution or source, in part or whole, and I hereby relinquish any rights on the code I changed to Sencha, to license however they see fit, if ever at all. blah blah.

    Notable things that I find useful personally with this version:

    1. Many times there are debuggers, editors or other tools that have serious cows with long lines, especially the IE debugger and some compare tools. I tend to limit my line lengths to 1000 or less. But probably anything less than like 2k line lengths is orders of magnitude better. Possibly faster for some browsers at run time too, maybe handheld's.

    2. It more closely emulates what final Sencha distribution builds look like, especially the compressed files. In fact if you ran the default project build file in the distribution with header collapse on and no line size option, ext-all.js woudl look exactly the same. Allowing the header redundancies to be removed also helps a great deal when using compare tools.

    3. CSS compression is a pain to do by hand. I've spent many hours splicing Ext by hand and this should save a ton of work for some. Even though CSS compresses very little relatively, its still accumulative for bandwidth cost, user time, packaging, parse time, and so forth.

    4. This version should be easier to deal with now for non Ext source and your own projects. By default, with no options turned on, it's cognisant of things such as placing matching headers with correct encoding and line endings per-file, and the BOM codes correctly and all that kind of thing. Should work decently for other languages and people who are tying to do localizations in JS and the source is not necessarily in utf-8. This version you can also force before the compression takes place if the JS or CSS compressor are choking. And line endings can be forced, as its realy easy to have mixed LE files, as even the Sencha distribution as a good number of mixed LE files.

    Code:
     
    JSBuilder2 is a JavaScript and CSS project build tool.
    For additional information, see http://extjs.com/products/jsbuilder/
     
    JSBuilder version 2.0.3
     
    Available arguments:
    --projectFile -p    (REQUIRED) Location of a jsb2 project file
    --homeDir -d        (REQUIRED) Home directory to build the project to
    --verbose -v        (OPTIONAL) Output detailed information about what is being built
    --debugSuffix -s    (OPTIONAL) Suffix to append to JS debug targets, defaults to \'debug\'
    --help -h           (OPTIONAL) Prints this help display.        
     
    Additional Contrib Options:  (these options are contributions not in the original 2.0.0 source.)");
    --sourceDir -f      (OPTIONAL) Overrides using the projectFile path as the source files path.
    --deployDir -n      (OPTIONAL) Overrides the deployDir (package name) setting in the .jsb2 file.
    --forceEncoding -e  (OPTIONAL) Convert text files to 'UTF-8', 'UTF-16LE', etc...
    --forceLineEnd -l   (OPTIONAL) Convert uncompressed CSS and JS files to 'unix' or 'windows'
    --stripComments -c  (OPTIONAL) Strip comments from debug versions of files
    --removeTempPkg -T  (OPTIONAL) Remove packages marked as temporary for deployment builds
    --removeFilter -F   (OPTIONAL) Remove files and folders designated by filter.
    --deployMode -D     (OPTIONAL) Set common options for deployment builds.
     Specifically: -l unix -e UTF-8 -L 1000 -c -C -I -T
                                    -F pkgs;src;test;welcome;docs;ext.jsb2;index.html
     
    Additional YUI Options:  (these options are the same as the YUI compressor command line options)
    --yui-line-break -L            (OPTIONAL) defaults to -1, which is no line breaks
    --yui-verbose -V               (OPTIONAL) defaults to not verbose
    --yui-nomunge -M               (OPTIONAL) defaults to munge function variables
    --yui-preserve-semi -P         (OPTIONAL) defaults to not preserve simi-colons at end
    --yui-disable-optimizations -O (OPTIONAL) defaults to enabling micro optimizations
    --yui-compress-css -C          (OPTIONAL) defaults to not compress css
    --yui-collapse-license -I      (OPTIONAL) defaults to not consolidating licenses per file

  8. #8
    Sencha User
    Join Date
    Feb 2011
    Posts
    10
    Vote Rating
    2
    Beeaar is on a distinguished road

      0  

    Default


    Using in Ant Example, this will run JSBuilder with CSS compression on, header reduction, and line width of 500 chars.

    Utility Target:
    Code:
    	<path id="jsbuilder.classpath">
    		<fileset dir="${lib.java.dir}">
    			<include name="sencha/JSBuilder2.jar" />
    		</fileset>		
    	</path>
    	<target name="generate.js">
    	     <mkdir dir="${output}" />	
    	     <java classname="com.extjs.JSBuilder2" failonerror="true" fork="true">
    			<classpath refid="jsbuilder.classpath"/>
    			<sysproperty key="java.library.path" value="lib/"/>
    			<arg line="--projectFile ${input}"/>
    			<arg line="--homeDir ${output}"/>
    			<arg line="-L 500 -C -I"/>	     	
    	     </java>     
    	</target>
    Call Target:
    Code:
        <antcall target="generate.js">
            <param name="input" value="${lib.js.dir}/ext-3.3.1/ext.jsb2"/>
            <param name="output" value="${build.dir}/generate"/>
        </antcall>

  9. #9
    Sencha User
    Join Date
    Feb 2011
    Posts
    10
    Vote Rating
    2
    Beeaar is on a distinguished road

      0  

    Default


    JSBuilder2 Contrib Notes:
    (please read the readme for notes on how to use the tool including relatively easy ways to make your own builds)

    1. License Header Collapse ---

    The way this was implemented is such that all license headers are set to be removed by the compression stage, if they match the header that is in the JS build file exactly. The redundant headers will be left in the debug version, but marked so that YUI compressor will remove it when it gets compressed. This solves several problems. And this should keep Sencha happy, as no headers get removed that aren't being placed as the top header, an by default (using the default Ext build files and source) redundant Ext headers are removed in a way where its easy for people to keep the headers on the source, they stay on the debug files, and you get one header on the compressed files. I imagine people were removing the headers on the source. This also allows people trying to stay above board to stay above board no matter what they throw at the tool. The original problem was that Sencha needed to add the headers to the source for distribution to us, but that caused problems for anyone wanting to end up with files formatted the same as their release files.

    2. On CSS compression.....

    CSS compression in this tool is a first class citizen. Code paths are now the same for CSS as they are for JS files. This means that, css which is not compressed will have -debug appended and compressed versions will not. You Will have to enable the CSS compression with the arguments, which are in the read-me and the help. If the option is not on then the behavior remains the same is it was previously. CSS files will be uncompressed with their default names. The line-length param applies to both JS and CSS files, so whatever you set it for, it will be used for both.

    3. Performace...

    This should be at least a slightly more performant version, if its not please let me know. There were a good number of places to attack, of which I only attacked some.

  10. #10
    Sencha User
    Join Date
    Mar 2007
    Posts
    580
    Vote Rating
    0
    dolittle is an unknown quantity at this point

      0  

    Default


    Can you please update the YUI Compressor version?
    A new version was released on 04/15/2011
    http://yuilibrary.com/downloads/#yuicompressor