requireJS应用

首先创建app.js

require.config({
    paths : {
        jquery : './lib/jquery',
        //css.js是为了给requireJS导入css文件模块进行转换用的
        //注意：导入模块的名字前面要加一个标识例如：$css，不加$的话有可能会有问题
        $css : './lib/css',
        //text.js是为了给requireJS导入html文件模块进行转换用的
        text : './lib/text',
        //underscore.js是为了支持backbone.js
        underscore : './lib/underscore',
        //backbone.js 是一个框架，但我们只用到里面的路由模块功能
        backbone : './lib/backbone',
        //导入路由模块
        router : './router',
        //导入百度模板
        template : './lib/baiduTemplate'
    }
});

require(['jquery', 'backbone', 'router'], function ($, Backbone) {
    $(function () {
//      console.log(Backbone);
        //需要启动一下
        Backbone.history.start();
    })
});

配置路由router.js

define(['backbone'], function (Backbone) {
    //配置路由
    var Router = Backbone.Router.extend({
      routes: {
        //属性是跳转时候的锚点名字
        //值是要实现的功能函数
        "home": "home", 
        "*action": "defaultAction"
      },
      // 首页
      home: function() {
        require(['./modules/home/home'], function (home) {
            home.render();
        });
      },
      defaultAction:function () {
        location.hash = "home";
      }
    //需要实例化一下路由
    var router = new Router();
});

index.html

    
    

    

        

            //设置锚点
            
首页
        
    
    

home目录下的home.js

//导入相应的css和html，需要借用$css和text模块进行转换
//导入html语法格式：text！+路径
//h  导入css语法格式：$css! + 路径
define(['text!./cart.html','$css!./cart.css'],function (html) {
    function render () {
        $("#container").html(html);
    }
    return{
        render:render
    }
});