2013-08-08 9 views
1

간단한 백본 웹 응용 프로그램을 만들려고합니다. 내 의존성을 모두 관리하려면 require를 사용하고 있습니다. 내 HTML은 매우 간단합니다 : 당신은 내가 경로 제목 main에 내 응용 프로그램을 시작할 볼 수 있듯이기본 백본보기가 표시되지 않습니다.

require([ 
    'backbone', 
    'views/application.view' 
    ], function(Backbone, app) { 
    var Router = Backbone.Router.extend({ 
    routes: { 
     "": "main" 
    }, 

    main: function(){ 
     var appView = new app(); 
     appView.render(); 
    } 
    }); 

    var router = new Router(); 
    Backbone.history.start(); 
}); 

:

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="utf-8"> 
    <link rel="stylesheet" type="text/css" href="./css/todos.css"> 
    <title>Clinical Auth</title> 
    <script type="text/javascript" src="js/lib/require-2.1.1.js" data-main="js/app"></script> 
    </head> 
    <body> 
    <div id="container"></div> 
    </body> 
</html> 

내 app.js 내 application.view.js를 호출 단지 라우터 . 내 application.view.js도 매우 간단합니다. 또한

define(function(require) { 
    "use strict"; 

    var Backbone = require('backbone'); 
    var $ = require('jquery'); 
    var AppView = Backbone.View.extend({ 
    el: $('#container'), 
    render: function() { 
     $(this.el).append("<div>hello world</div>"); 
     return this; 
    } 
    }); 

    return AppView; 
}); 

, 여기 내 require.config 파일입니다 : 내 주요 경로에서 중단 점을 설정하면

require.config({ 
    baseUrl: "./js/", 
    paths: { 
    jquery: 'lib/jquery-1.8.2', 
    underscore: 'lib/underscore-1.4.2', 
    backbone: 'lib/backbone-0.9.2', 
    'backbone.localStorage': 'lib/backbone.localStorage' 
    }, 
    shim: { 
    underscore: { 
     exports: "_" 
    }, 
    backbone: { 
     deps: ['underscore', 'jquery'], 
     exports: 'Backbone' 
    }, 
    'backbone.localStorage': { 
     deps: ['backbone'], 
     exports: 'Backbone' 
    } 
    } 
}); 

, 나는 container가 조작되고 있음을 볼 수 있지만, 그것을 만드는되지 않습니다 내 화면으로. 내가 도대체 ​​뭘 잘못하고있는 겁니까? 나는 이것이 단순 할 것이라고 알고 있지만, 나는 머리카락을 꺼내 ​​가고있다.

+0

'app'에'el'을 전달하는 것은'var app = new app ({el : $ ('# container')})'와 같은 것입니다. – Jack

+0

아마도 타이밍 문제로, 대신 'el :'# container''을 사용하지 않으시겠습니까? –

+0

'require '로 끝내면 잘 동작한다. http://jsfiddle.net/sushanth009/VLf65/ –

답변

0

이 코드에는 문제가 없습니다. container 요소 표시 속성을 none으로 설정 한 CSS 파일이 있습니다. 죄송합니다 everyones 시간을 낭비하십시오.

관련 문제