Aurelia联系经理没有加载模块

Question

我正在关注联系人经理教程。添加了bootstrap和jQuery依赖项以及no-selection ts和html;但是当app启动时，我在控制台中看到了与教程文本中预期不同的消息：

ERROR [app-router] Error: Load timeout for modules: no-selection

接着是

ERROR [app-router] Router navigation failed, and no previous location or fallbackRoute could be restored.

代码如下所示：

app.ts：

    import {Router, RouterConfiguration} from 'aurelia-router';

export class App {
  router: Router;

  configureRouter(config: RouterConfiguration, router: Router){
    config.title = 'Contacts';
    config.map([
      { route: '',              moduleId: 'no-selection',   title: 'Select'},
      { route: 'contacts/:id',  moduleId: 'contact-detail', name:'contacts' }
    ]);

    this.router = router;
  }
}

app.html：

<template>
  <require from="bootstrap/css/bootstrap.css"></require>
  <require from="./styles.css"></require>


  <nav class="navbar navbar-default navbar-fixed-top" role="navigation">
    <div class="navbar-header">
      <a class="navbar-brand" href="#">
        <i class="fa fa-user"></i>
        <span>Contacts</span>
      </a>
    </div>
  </nav>

  <div class="container">
    <div class="row">
      <div class="col-md-4">Contact List Placeholder</div>
      <router-view class="col-md-8"></router-view>
    </div>
  </div>
</template>

依赖项添加到aurelia.json：

 "jquery",
          {
            "name": "bootstrap",
            "path": "../node_modules/bootstrap/dist",
            "main": "js/bootstrap.min",
            "deps": ["jquery"],
            "exports": "$",
            "resources": [
              "css/bootstrap.css"
            ]
          },

无selection.ts

export class NoSelection {
  message = "Please Select a Contact.";
}

无selection.html：

<template>
  <div class="no-selection text-center">
    <h2>${message}</h2>
  </div>
</template>