Does the application route load automatically and load the application.hbs in an Ember app?

Question

I have this as my router.js. Note that it has no application route:

import Ember from 'ember';
import config from './config/environment';

var Router = Ember.Router.extend({
  location: config.locationType
});

Router.map(function() {
  this.route('todos', { path: '/'});
});

export default Router;

When I hit the home path, I see my application.hbs template and the todos.hbs template is loaded in the outlet. This is my application.hbs:

<section id="todoapp">
  <header id="header">
    <h1>todos header in application.hbs</h1>
  </header>

  {{outlet}}
</section>

<footer id="info">
  <p>
    Footer in application.hbs. Double-click to edit a todo
  </p>
</footer>

Why does my application.hbs get loaded?

I assume Ember knows to also load the todos.js in my routes folder which is this:

import Ember from 'ember';

export default Ember.Route.extend({
  model() {
    let todos = [
      {
        title: 'Learn Ember',
        complete: false,
      },
      {
        title: 'Solve World Hunger',
        complete: false,
      }
    ];
    return todos;
  }
});

And this is my todos.hbs template:

<h2>Todos Template</h2>

<ul>
    {{#each model as |todo|}}
        <li>
            {{todo.title}}
        </li>
    {{/each}}
</ul>

Main questions
1. Why does my application.hbs get loaded when I hit the home route?
2. What is export default mean?
3. What is the line import Ember from 'ember' doing? Where is 'ember' coming from?

Gaurav Gaurav · Accepted Answer · 2015-11-02T14:42:12

The application route is loaded in every Ember.js application. See http://guides.emberjs.com/v2.1.0/routing/defining-your-routes/#toc_the-application-route
export default is part of the ES6 module specification. See http://exploringjs.com/es6/ch_modules.html It takes the object or variable to be returned as the default thing to be imported when that module is imported inside another module.
The 'ember' namespace is built into Ember CLI. Its default export is itself, the Ember variable, which was once a global variable in prior versions of Ember.

Does the application route load automatically and load the application.hbs in an Ember app?

1 Answers