ryancanulla.com

Automation

Auto-Compiling ExtJS Saas with Sencha CMD 4

Posted on .

Auto-Compiling ExtJS Saas with Sencha CMD 4

Introduction

With the recent release of Sencha CMD 4.0, we get the “somewhat” undocumented watch command (only reference I’ve found to it was in the beta1 release notes). This command will watch your file system for changes and automatically rebuild the parts of your app that have changed and need to be rebuilt. There is no longer a need to switch back to the terminal window and run the refresh/build commands. It’s all handled for you. Read on to see an example.

CMD 4.0
If you are running an older version of Sencha CMD and are looking to upgrade, this may help. If you have CMD 4.0, skip this section :-).
Upgrading Sencha Cmd
Dealing With Merge Conflicts || Alternative Strategies

Having Trouble Upgrading?
To confirm that your upgrade worked (or find the install path) check the version from the command line:

$ sencha which
$ Sencha Cmd v4.0.0.203
$ /Users/ryancanulla/bin/Sencha/Cmd/4.0.0.203/

If you have ran the install and are still seeing an older version of CMD targeted, it’s probably being written to your system $PATH variable twice. In OSX you can do the following to fix it:

$ echo $PATH
/Users/ryancanulla/bin/Sencha/Cmd/4.0.0.203:/usr/bin:/bin:/usr/sbin:/sbin:/usr/local/bin:/usr/X11/bin:/usr/local/git/bin

If you see two references to CMD, just remove the older one from your ~/.bash_profile:

$ vim ~/.bash_profile

Make sure there is only one line adding this to the PATH. Mine looks like this:

export PATH=/Users/ryancanulla/bin/Sencha/Cmd/4.0.0.203:$PATH

Java 7
You will need JDK 7 to use the watch command. Currently, it’s the only part of CMD that requires this version of Java. The rest will continue to work as is with 6 or 7. If you aren’t sure which version of Java you are running, open terminal and try this:

$ java -version
java version "1.7.0_40"
Java(TM) SE Runtime Environment (build 1.7.0_40-b43)
Java HotSpot(TM) 64-Bit Server VM (build 24.0-b56, mixed mode)

If it’s older, go ahead and get the latest version here.

Running the Watch Command
Now all you need to do is run the watch command from any terminal window and Sencha CMD will do the rest:

$ sencha app watch

You will see it run your app build once when you first run the command, then it will pause and watch for changes:

$ sencha app watch
Sencha Cmd v4.0.0.203…

When it’s complete, you will see it now waits for changes to your app:

[INF] waiting for changes…

If you make a change in the Saas directory (adding/modifying files & directories) we will see it re-run, then pause again for changes:

[INF] Re-build complete : 2013-10-08 12:44:02 PM
[INF] waiting for changes…

Tip
If you use WebStorm (I highly recommend it), you can run this right inside your IDE by going to Tools > Open Terminal or hitting Ctrl+Shift+X:

webstorm-terminal-running-watch

There are no comments.

Leave a Reply

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

View Comments (0) ...
Navigation