5

I'm migrating my project from a situation where it was a nested asset in a Rails app to a separate frontend with Ember-Cli. And I've been stuck with the following problem for quite some time now:

When running $ Ember serve in my terminal and opening localhost:4200 with Chrome I get the following error in the console: Uncaught TypeError: undefined is not a function in app-boot.js:25

On that line the following code is present:

require("my_app/app")["default"].create({
  "defaultLocale":"en",
  "name":"my_app",
  "version":"0.0.0.bece32c1"
});

I added a breakpoint on that line and checked if require("my_app/app" was defined, and it was Object {default: Class} so I checked if the default object property was defined, and this also was the case:

Class {modulePrefix: "my_app", podModulePrefix: undefined,
       Resolver: function, _readinessDeferrals: 1, $: function…}

The console output of require("my_app/app")["default"] can be seen in the following screenshot:

enter image description here

This is the content of my config/environment file:

enter image description here

And this is the content of my app/index.html file:

enter image description here

And this is the content of my app/app.js file:

enter image description here

I'm using the latest version of Ember-cli, Ember v1.10.0, ember-data v1.0.0-beta.15 and Jquery 1.11.2

============= Update 1: origin of app-boot.js ==================

Someone asked where the app-boot.js was located as he was only familiar with https://github.com/ember-cli/ember-cli/blob/master/lib/broccoli/app-boot.js Below is a screenshot of the resources pane in Chrome, showing that it is in fact a compiled vendor asset of ember-cli.

enter image description here

== Update 2: commenting I18N import and include constants in initialisation ==

I did do some refactoring and commented the I18N import that maybe is conflicting. I also included the constants inside the Ember app initialisation. see screenshot below for current version of app.js:

enter image description here

I didn't edit my Brocfile.jsas far as I know but decided to include a screenshot of it anyway because maybe it contains a bug.. you never know..

enter image description here

I hope someone knows a solution for this problem or can point me in the right direction. If you need more information don't hesitate to ask!

Thanks in advance,

Alexander Jeurissen

ajeurissen
  • 85
  • 9
  • What is this `app-boot.js`? I'm only aware of https://github.com/ember-cli/ember-cli/blob/master/lib/broccoli/app-boot.js. I guees it would be a good idea to tell us, what you are trying to achieve, because your approach seems to not follow ember-CLI's conventions. – AWM Mar 25 '15 at 14:18
  • the `app-boot.js` is a file compiled by ember-cli while building the app. I haven't created it myself. As far as I know I'm following the ember-cli conventions. What I did to start this migration process is init a new ember-cli app with ember init. Then copy over the `routes`, `models`, `controllers` etc. refactoring all of those to use es6 modules and ember-cli naming conventions. – ajeurissen Mar 25 '15 at 14:32
  • @AWM I updated the original post with an explanation of the origin of app-boot.js as well as a screenshot of the loaded resources taken from Chrome-devtools. – ajeurissen Mar 25 '15 at 14:51
  • 1
    ah yes, I see. Well, your config looks fine. My first approach of debugging would be, to check if `ember-cli-i18n` is the cause of this. So what about commenting out that `import t` in your `app.js`. Maybe also configure those Constants and KeyMappings via initializer? And have you altered your `brocfile.js`? – AWM Mar 25 '15 at 14:52
  • @AWM thanks for the advise I commented the `ember-cli-i18n` import in app.js and moved the definition of the Constants and keymaps in Ember.Application constructor (not sure if that is what you meant with `configure those Constants and KeyMappings via initializer`). I also included a screenshot of my Brocfile.js which is just the default I think. – ajeurissen Mar 25 '15 at 15:07
  • yeah, your brocfile is the default one. if disabling `ember-cli-i18n`-stuff doesn't help, than maybe another addon is causing this. what have you installed? I also noticed another thing: is you app really called "my_app"? That might lead to trouble, because it should be "my-app". e.g. if you do `ember new my_app` you will still get `modulePrefix: 'my-app'`. only the folder will be `my_app`. So how did you generate this? – AWM Mar 25 '15 at 15:20
  • well the real name of the app is not `my_app` and the real name does use normal hyphens i.e `-` – ajeurissen Mar 25 '15 at 15:24
  • 1
    Ok. I would advise that you do something like `ember new my-app` and check, where this derives from your app. You must have added something that messed up the app initialization. Then post your changes (e.g.: additions to `package.json`, `environment.js` etc.). You don't need to post any default files. – AWM Mar 25 '15 at 15:37
  • 1
    well, with initializer I meant: https://github.com/ember-cli/ember-cli/blob/master/blueprints/initializer/files/app/initializers/__name__.js. Why not set KeyMappings and Constants there or in `environment.js`? What are you going to with those values? For now, you should comment out the whole `var LS`-part and that console wrapper. Then you are back to default `app.js`. Let's see whether that helps. – AWM Mar 25 '15 at 15:47
  • 1
    well that commenting out `LS` was misleading. just use this: https://github.com/ember-cli/ember-cli/blob/master/blueprints/app/files/app/app.js – AWM Mar 25 '15 at 15:50
  • Ok using the default app.js that you linked solved the issue.. I have no idea why but thanks, create an answer and I'll mark it and give you rep ;) – ajeurissen Mar 25 '15 at 16:01
  • 2
    @AWM I found the conflicting part. I still had `Ember.Application.create` instead of `Ember.Application.extend`.. ugh crazy how one keyword can let you go so deep down the rabbit hole... – ajeurissen Mar 25 '15 at 16:07
  • Great, to hear it is fixed. I'll post an answer, even if I didn't see `.create` in the fist placed ;-) – AWM Mar 25 '15 at 16:15

1 Answers1

4

As collaboratively (see discussion) traced:

Use

Ember.Application.extend

instead of

Ember.Application.create

in your app\app.js (like in https://github.com/ember-cli/ember-cli/blob/master/blueprints/app/files/app/app.js).

ajeurissen
  • 85
  • 9
AWM
  • 1,130
  • 11
  • 23
  • 1
    I edited the answer as it is the other way around ;) `Ember.Application.extend` is the correct keyword to init the app. The reason that there was no Create method on my App is because it was already created ;) – ajeurissen Mar 25 '15 at 16:28
  • yeah, thanks for fixing the typo. I should proof read my answers ;-) – AWM Mar 25 '15 at 16:29