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