Edited at

[JSを書くなら]複雑になりがちなBackboneJSのモジュールをrequireJSで管理する入門

More than 5 years have passed since last update.

require.jsとかbackbone.jsとか連携させようと思うと

応用系の記事ばっかり見つかるので、自分で纏めました。

今回は、node.jsで作成した為、以下の構成になっています。

|-- app.js

|-- index.html
|-- requires
| `-- test.js
`-- views
|-- test1.js
`-- test2.js

http://localhost/index.html でアクセス出来る環境

各ファイルの内容に関しては、後半説明します。


RequireJSって何?

JSの非同期ローディングとモジュール化を行うライブラリ

詳しくは公式サイト(英語)みてね

http://requirejs.org/


ではでは、能書きはええから先に進みます。


index.htmlの中身は?


index.html

  1 <!DOCTYPE html>                                                       

2 <html lang="ja">
3 <head>
4 <meta charset="utf-8">
5 <title>hello connect</title>
6
7 <script src="//code.jquery.com/jquery-1.10.2.js"></script>
8 <script src="//underscorejs.org/underscore-min.js"></script>
9 <script src="//backbonejs.org/backbone-min.js"></script>
10 <script src="//requirejs.org/docs/release/2.1.8/minified/require.js"></script>
11
12 </head>
13 <body id="body">
14 hello RequireJS World!!!
15
16 <div id='view'>
17 index.htmlで最初から表示<br/>
18 </div>
19
20 <!-- #1 注目 -->
21 <script src="requires/test.js"></script>
22 </body>
23 </html>

headで必要なlibraryを書いてます。

jquery, undersocreJS, backboneJS

それに、requireJS、まぁ普通ですよね。

今までと変化があるとしたら、それは

21行目です。