How to use Sencha SDK for ExtJS?

Question

I am using ExtJS 4.1 and I am deploying my simple HelloExt program on GlassFish V3.1.

I am trying to create a build from Sencha SDK.

I have used the following two commands...

C:\>sencha create jsb -a http://localhost:8080/HelloExt/index.jsp -p appname.jsb
3 -v


C:\>sencha build -p appname.jsb3 -v -d .

As per the documentation, it will create app-all.js file. But where does it create the file?

How can I know IF build are created successfully or not?

Where are the generated JS files?

I made a search but I can not found anything like app-all.js.

For more information:

I am using JDK 1.6.0_12 and GlassFish V3.1 application server.

Here are the edited content of the question ....

And when I am trying to use the sencha SDK, It generates a .dpf file into the class path. The contents of the .dpf file as as below ...

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE glassfish-web-app PUBLIC "-//GlassFish.org//DTD GlassFish Application Server 3.1 Servlet 3.0//EN" "http://glassfish.org/dtds/glassfish-web-app_3_0-1.dtd">
<glassfish-web-app error-url="">
  <context-root>/HelloExt</context-root>
  <class-loader delegate="true"/>
  <jsp-config>
    <property name="keepgenerated" value="true">
      <description>Keep a copy of the generated servlet class' java code.</description>
    </property>
  </jsp-config>
</glassfish-web-app>

Can anyone tell me Why here it generated .DPF file ? Why its not generating the app-all.js file ?

Answer 1

Try running the command from inside the app root directory and then using a relative path:

0) open cmd window

1) run in cmd window: "cd C:\[webserver_webapp_root]\[app_name]"

In other words change the cmd directory to the app root. Fill in the bracketed text above with the correct paths.

2) run in cmd window: "sencha create jsb -a index.html -p app.jsb3 -v"

The app.jsb3 should be created in your app's root directory (C:\[webserver_webapp_root]\[app_name]). Open it up and make sure it contains all of your app classes, it should look something like this:

{
    "projectName": "Project Name",
    "licenseText": "Copyright(c) 2012 Company Name",
    "builds": [
        {
            "name": "All Classes",
            "target": "all-classes.js",
            "options": {
                "debug": true
            },
            "files": [
                {
                    "clsName": "YourApp.view.Viewport",
                    "name": "Viewport.js",
                    "path": "app/view/"
                },
                // plus ALOT more classes...
            ]
        },
        {
            "name": "Application - Production",
            "target": "app-all.js",
            "compress": true,
            "files": [
                {
                    "path": "",
                    "name": "all-classes.js"
                },
                {
                    "path": "",
                    "name": "app.js"
                }
            ]
        }
    ],
    "resources": []
}

If everything looks fine then you can go onto the next step, if not then there is something wrong with your app directory structure and you need to fix it per Sencha recommended ExtJS application architecture.

You can also use any error messages to help identify the problem.

3) update placeholders ("Project Name", etc) at the top of app.jsb3

4) run in cmd window: "sencha build -p app.jsb3 -d . -v"

The app-all.js file should also be created in the app's root directory. If the cmd window doesn't give any errors before it says "Done Building!" then you are all done. You can now change your index.html script link to point to app-all.js instead of app.js.

If there are errors then you have to fix those and run this again.

Other things you can try:

In response to your last comment, your -p switch parameter should be a jsb3 file not jsb.

Make sure that the web server is running and that your app runs without any errors before you try to use the SDK Tools.

Then try these:

C:\Projects\HelloExt\build\web>sencha create jsb -a index.jsp -p HelloExt.jsb3 -v

C:\Projects\HelloExt>sencha create jsb -a index.jsp -p HelloExt.jsb3 -v

C:\>sencha create jsb -a [actual IP address]:8080/HelloExt/index.jsp -p HelloExt.jsb3 -v

Fill in your actual IP address where the brackets are (not localhost).

This should produce the jsb3 file shown in #2 above then you can move on to step #3 above.