首页 > 代码库 > requirejs 笔记
requirejs 笔记
index.html
<!doctype html><html> <head> <title>requirejs</title> <meta charset="utf-8"> <script data-main="js/main" src="js/require.js"></script> </head> <body> </body></html>
main.js 合并js功能
require.config({ // baseUrl: ‘js/lib‘, 如果加载的这三个js不和main在一个目录下,就这样配置这个参数,或者直接写网址路径 paths: { underscore: ‘underscore.min‘, backbone:‘backbone.min‘, jquery: ‘jquery-1.9.1.min‘, math :‘math‘ }, /* shim属性,专门用来配置不兼容的模块。具体来说,每个模块要定义(1)exports值(输 出的变量名),表明这个模块外部调用时的名称;(2)deps数组,表明该模块的依赖性。 */ shim: { ‘underscore‘:{ exports: ‘_‘ }, ‘backbone‘: { deps: [‘underscore‘, ‘jquery‘], exports: ‘Backbone‘ } }/*jQuery的插件可以这样定义 shim: { ‘jquery.scroll‘: { deps: [‘jquery‘], exports: ‘jQuery.fn.scroll‘ } }*/}); // require([‘jquery‘], function($) {// alert($().jquery);// });require([‘jquery‘, ‘underscore‘, ‘backbone‘], function ($, _, Backbone){ // some code here alert($().jquery);});// 如果不依赖其他模块require([‘math‘],function(math){ alert(math.add(1,2))})// domready插件,可以让回调函数在页面DOM结构加载完成后再运行。require([‘domready!‘], function (doc){ // called once the DOM is ready});/* require()函数接受两个参数。第一个参数是一个数组,表示所依赖的模块, 上例就是[‘moduleA‘, ‘moduleB‘, ‘moduleC‘],即主模块依赖这三个模块;第二个参数是一个回调函数, 当前面指定的模块都加载成功后,它将被调用。加载的模块会以参数形式传入该函数,从而在回调函数内部就 可以使用这些模块。*//* require()异步加载moduleA,moduleB和moduleC,浏览器不会失去响应;它指定的回调函数,只有前面的模块 都加载成功后,才会运行,解决了依赖性的问题。 *//* 1、data-main属性 2、require.config方法 3、require函数 */
math.js 自定的js
// 这种定义 是不依赖其他模块define(function(){ var add = function( x , y){ return x+y ; } return{ add : add }});// 否则 这样定义// define([‘mylib‘],function(mylib){// function foo(){// mylib.doSomething();// }// return {// foo : foo// };// })
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。