requireJs require.config公共配置

//场景：让require.config配置文件成一个公共文件,每个页面引用这个公共配置

//方式一样例：
require.config({
    baseUrl: (function () {
        var pathName = document.location.pathname;
        var index = pathName.substr(1).indexOf("assets/");
        var result = pathName.substr(0, index + 1);
        return result;
    })()+'assets/js/', //基础目录,最好使用绝对路径,不然被路径搞得晕头转向，/开头, (../上一级目录 ./当前目录 /根目录)
    paths:{
        "jquery":"plugins/jquery/jquery-1.8.0.min",
        "text":"plugins/require-text/text",
        'Handlebars':'plugins/handlebars/handlebars',
        'underscore':'plugins/underscore/underscore-min'
    },
    shim:{
        'pocFilter':{
            deps:['jquery'],
            exports: 'pocFilter'
        }
    }
});

//引用require.js
<script src="scripts/require.js" data-main='scripts/business/example'></script>

//example.js使用公共配置
require(['scripts/config'], function() {
    // Configuration loaded now, safe to do other require calls
    // that depend on that config.
    require(['jquery'], function($) {

    });
});

//方式二:

1、html页面:
    <script src="require.js" defer async="true" data-main="page1"></script>

2、page1.js:
require(['config'],function(){
    require(['app/controller1'])
})

3、controller1.js：
define(function(require,exports,module){
    var $=require('jquery');
    console.info($)
})

//参考资料-https://github.com/requirejs/example-multipage.git


//模块定义方式

//1.简单的键值对形式 Simple Name/Value Pairs
define({
    "name":"leyi",
    "sex":"male"
});

//2.定义函数型模块 Definition Functions
define(function(){
    function setName(name){
        console.info(name)
    }
    function setSex(sex){
        console.info(sex)
    }

    return {
        "setName":setName,
        "setSex":setSex
    }
});

//2.定义函数型模块(有依赖模块) Definition Functions with Dependencies

define(['jquery'],function($){
    return {
        "lookDependencies":function(){
            console.info($)
        }
    }
});

//3.模块不必返回对象。允许从函数中返回任何有效值

define(['jquery'],function($){
    return function(){
        return 'hello world!'
    }
});

//4.用commonJS方式定义模块
define(function(require,exports, module){
    var $=require('jquery');
    return function(){
        console.info($)
    }
})

//5.定义一个有名称的模块(不推荐显式指定模块名称)
define("leyi",function(require,exports, module){
    var $=require('jquery');
    return function(){
        console.info($)
    }
});

//注意事项：

/*一个文件一个模块: 每个Javascript文件应该只定义一个模块，
 这是模块名-至-文件名查找机制的自然要求。
 多个模块会被优化工具组织优化，但你在使用优化工具时应将多个模块放置到一个文件中。*/

/*
 define()中的相对模块名: 为了可以在define()内部使用诸如require("./relative/name")的调用以正确解析相对名称，
 记得将"require"本身作为一个依赖注入到模块中：
 define(["require", "./relative/name"], function(require) {
 var mod = require("./relative/name");
 });
 或者更好地，使用下述为转换CommonJS模块所设的更短的语法：
 define(function(require) {
 var mod = require("./relative/name");
 });*/

　　

转载于:https://www.cnblogs.com/leyi/p/4886743.html