Ember-Cli refactoring to use pods

Question

I have just started to refactor our Ember application to use Pods so that our directory/file structure is more manageable. At the same time i have upgraded Ember-Cli so I am running with the following configuration:

Ember      : 1.8.1
Ember Data : 1.0.0-beta.12
Handlebars : 1.3.0
jQuery     : 1.11.2

I have updated the the environment.js to include the following

modulePrefix: 'emberjs',
podModulePrefix: 'emberjs/pods',

I have also tried to set it to 'app/pods' and just 'pods' but with no luck.

The directory structure is as follows:

emberjs/
     app/
       controllers - original location, still has some original controllers here for other parts of the system
       pods/
          job/
            parts/
               index/
                  controller.js
                  route.js
                  template.hbs
                edit/
                  controller.js
                  route.js
                  template.hbs

The application build ok and if i look in the emberjs.js file i can see the various defines for the pods controllers, routes and templates

e.g.

define('emberjs/pods/job/parts/index/controller', ['exports', 'ember'], function (exports, Ember) {
define('emberjs/pods/job/parts/index/route', ['exports', 'ember'], function (exports, Ember) {
define('emberjs/pods/job/parts/index/template', ['exports', 'ember'], function (exports, Ember) {

so something is recognising the pods structure.

But the problem comes when I try to access this route. I get a warning message in the console and get nothing displayed - basically it says it can find the template abd it looks like it is using an generated controller.

generated -> controller:parts Object {fullName: "controller:parts"}
vendor-ver-1423651170000.js:28585 Could not find "parts" template or view. Nothing will be rendered Object {fullName: "template:parts"}
vendor-ver-1423651170000.js:28585 generated -> controller:parts.index Object {fullName: "controller:parts.index"}
vendor-ver-1423651170000.js:28585 Could not find "parts.index" template or view. Nothing will be rendered Object {fullName: "template:parts.index"}
vendor-ver-1423651170000.js:28585 Transitioned into 'jobs.job.parts.index'

If I look in the Ember inspector in Chrome I see that in the Routes section it shows parts/index to have route of parts/index controller as parts/index and template as parts/index. Is this what I should expect? I am not sure how Ember resolves the various parts when using pods.

To test this out I put a copy of the template in the templates/parts directory and reloaded it. This time it found the template and rendered it but lacking the data - probably due ti it using the default route and controller.

Does anyone any idea what I am doing wrong. have I missed out a step somewhere, or configured it incorrectly?

In the job and job.parts route, try adding a template.hbs file with only {{outlet}} inside it. — jax
have a look a this - programwitherik.com/ember-pods - , might be helpful — Yazan Rawashdeh
Have you looked up what the Resolver says? In the environment.js uncomment these lines: ENV.APP.LOG_RESOLVER = true; ENV.APP.LOG_ACTIVE_GENERATION = true; — Benedikt

Louay Alakkad Louay Alakkad · Accepted Answer · 2015-06-29T01:43:37

Try removing old routes/controllers/templates when adding new ones. Don't keep two copies.

Also it could be unrelated to your files structure. Try creating a blank app and copying files one by one, to see when the issue starts to happen. Use generators and then overwrite the generated files with yours if possible.

Ember-Cli refactoring to use pods

1 Answers