Backbone Marionette - выдает ошибку при вызове расширения макета

В своем приложении я использую Marionette расширение Backbone. Я получаю первую ошибку как:

Uncaught TypeError: Cannot read property 'extend' of undefined 

И я пытаюсь добавить свой заголовок и содержимое с нижним колонтитулом в элемент-оболочку... используя этот скрипт:

Но вообще не работает...

Каким будет правильный способ сделать это?

шаблон:

<div id="wrapper"></div>
<script id="layout-template" type="text/template">   
    <section>     
        <navigation id="menu">ABC</navigation>     
        <article id="content">123</article>   
    </section> 
</script>

сценарий:

AppLayout = Backbone.Marionette.Layout.extend({ 
    template: "#layout-template",
    regions: { 
        menu: "#menu", 
        content: "#content"
    } 

});

var layout = new AppLayout(); 
$('#wrapper').html(layout.render().el);

Вот демонстрация

Кто-нибудь поможет мне отобразить все мои элементы в оболочку, пожалуйста?