title: Trouble With Ext.Load Not Finding Required Files
body: <p>I'm trying to learn the new MVC architecture that ExtJS 4 is using and I'm having some serious issues. Here's what I get when I load the page (Chrome JS console):</p>
  
  <pre><code>ext-all-debug.js:3713[Ext.Loader] Synchronously loading 'Exercise.controller.Users'; consider adding Ext.require('Exercise.controller.Users') above Ext.onReady
  ext-all-debug.js:4757An uncaught error was raised with the following data:
  ext-all-debug.js:4758
  Object
  ext-all-debug.js:4764Ext.Loader is not enabled, so dependencies cannot be resolved dynamically. Missing required class: Exercise.controller.Users
  ext-all-debug.js:4771Uncaught Error
  </code></pre>
  
  <p>And here's a breakdown of my code:</p>
  
  <p><strong>index.php</strong></p>
  
  <pre><code>&lt;html&gt;
      &lt;head&gt;
          &lt;title&gt;&lt;/title&gt;
          &lt;style&gt;
              @import url('libraries/extjs/resources/css/ext-all.css');
          &lt;/style&gt;
          &lt;script src = "libraries/extjs/bootstrap.js"&gt;&lt;/script&gt;
          &lt;!--
          &lt;script src = "public/app/controller/Users.js"&gt;&lt;/script&gt;
          --&gt;
          &lt;script src = "public/app/app.js"&gt;&lt;/script&gt;
          &lt;script&gt;
          &lt;/script&gt;
      &lt;/head&gt;
      &lt;body&gt;
  
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Now, I know that the included controller script is commented out. When I explicitly include the controller this message goes away. The reason I am asking about this is because I thought Ext.loader was supposed to take care of loading the required files for me.</p>
  
  <p><strong>The Users Controller</strong></p>
  
  <pre><code>Ext.define('Exercise.controller.Users', {
      extend: 'Ext.app.Controller',
      init: function() {
          console.log('Initialized Users! This happens before the Application launch function is called');
      }
  });
  </code></pre>
  
  <p><strong>The Users Model</strong></p>
  
  <pre><code>Ext.define('Exercise.model.User', {
      extend: 'Ext.data.Model',
      fields: [{
          name: 'id',
          type: 'int'
      }, {
          name: 'created_at',
          type: 'date',
          dateFormat: 'Y-m-d H:i:s'
      }, {
          name: 'member_id',
          type: 'int'
      }, {
          name: 'first_name',
          type: 'string'
      }, {
          name: 'last_name',
          type: 'string'
      }, {
          name: 'password',
          type: 'string'
      }, {
          name: 'dob',
          type: 'date',
          dateFormat: 'Y-m-d'
      }, {
          name: 'email_address',
          type: 'string'
      }, {
          name: 'is_active',
          type: 'int'
      }],
      proxy: {
          type: 'ajax',
          format: 'json',
          url: '../../_dev/json_fixtures/users.json',
          reader: {
              type: 'json',
              root: 'users'
          },
          root: 'users'
      }
  });
  </code></pre>
  
  <p><strong>The User View</strong></p>
  
  <pre><code>Exercise.views.user.list = Ext.extend(Ext.grid.Panel, {
      store: Exercise.stores.users,
      renderTo: Ext.getBody(),
      columns:[{
          header: 'Member ID',
          dataIndex: 'member_id'
      }, {
          header: 'First Name',
          dataIndex: 'first_name'
      }, {
          header: 'Last Name',
          dataIndex: 'last_name'
      }],
      initComponent: function() {
          Exercise.stores.users.load();
          Exercise.views.UsersList.superclass.initComponent.apply(this, arguments);
      }
  });
  </code></pre>
  
  <p><strong>The app.js File</strong></p>
  
  <pre><code>Ext.application({
      name: 'Exercise',
      autoCreateViewport: true,
      appFolder: 'app',
  
      controllers: [
          'Users'
      ],
      launch: function() {
          Ext.create('Ext.container.Viewport', {
              layout: 'fit',
              items: [
                      {
                      xtype: 'panel',
                      title: 'Users',
                      html : 'List of users will go here'
                  }
              ]
          });
      }
  });
  </code></pre>
  
  <p>Side note: I've tried the solution found <a href="https://stackoverflow.com/q/5715626/122164">here</a> to no avail and I've tried setting my apps <code>appFolder</code> property to both <code>../app</code> and just <code>app</code>.</p>
  
  <p>Thanks for the help with this. </p>