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
가 조작되고 있음을 볼 수 있지만, 그것을 만드는되지 않습니다 내 화면으로. 내가 도대체 뭘 잘못하고있는 겁니까? 나는 이것이 단순 할 것이라고 알고 있지만, 나는 머리카락을 꺼내 가고있다.
'app'에'el'을 전달하는 것은'var app = new app ({el : $ ('# container')})'와 같은 것입니다. – Jack
아마도 타이밍 문제로, 대신 'el :'# container''을 사용하지 않으시겠습니까? –
'require '로 끝내면 잘 동작한다. http://jsfiddle.net/sushanth009/VLf65/ –