require.js 的简单运用 --兰

功能描述：

1.简单的require.js的运用

2.BaseUrl运用（加载不同文件夹下的路径）

3.shim运用（依赖：比如jquery-ui 需要依赖jquery）

4.require方法调用（包括回调方法使用）

1.文件的目录结构

main.js代码 require.config({baseUrl:"js",paths: {jquery: 'jquery-1.7.2',bootstrap_alert:'bootstrap-alert',model1:'model1/model1',model2:'model2/model2',math:'utils/math',jquery_ui:'jquery_plugin/jquery-ui',},shim:{'jquery_ui':{deps: ['jquery'],//jquery_ui依赖jqueryexports:"jquery_ui"}}
});//js文件加载完成后，执行的代码
require(['jquery','bootstrap_alert','model1','model2','jquery_ui'],function($,bootstrap_alert,model1,model2,jquery_ui) {alert($.ui.version);
});var math = require(['math'],function(math){math.add(1,3);
});

Chad.html代码<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script data-main="main" src="require.js"></script>
</head>
<body><script type="text/javascript"></script></body>
</html>

model1.js代码alert("model1文件夹 -->model1.js加载成功");define("model1",[],function(){//变量var param1 = 1;var param2 = "params";//添加function add(){alert("add");}//删除function del(){alert("delete");}//编辑function edit(){alert("edit");}//查询function find(){alert("find");}return {add:add,del:del,edit:edit,find:find,param1:param1,param2:param2};
});model2.js代码 --->>
alert("model2文件夹 -->  model2.js加载成功");define("model2",["model1"],function(model1){model1.del();alert(model1.param1);function page(){alert("page");}return {page:page};
});

转载于:https://www.cnblogs.com/huangwenyi/p/4485754.html

require.js 的简单运用 --兰相关推荐

require.js的简单使用
全局配置main.js: var version = +new Date(); require.config({urlArgs: 'v=' + version, // 根路径设置,paths下面全部都 ...
require.js理解
前言实习过程学习了require.js的相关内容,也在网上查阅了一部分资料,相比于其他框架,require.js更为简单易学,也更容易使用. 下面我就简单介绍我所认识的require.js,希望大家 ...
html引入layer.js,require.js引用jquery、layer的简单实例用法
来源: 未知发布时间: 2017-10-13 次浏览用法: 第一步在html页面上引入JS: 第一个require.js,注意引用的时候加了一个data-main="./index&qu ...
Require.js
前言前段时间粗略的扫过一次require.js,当时没怎么在意,结果昨天看到index里面的代码就傻了,完全不知道从哪开始看啦,所以require与backbone的学习还要加紧才行. 由于前端所占 ...
require.js基本认识
基本API require会定义三个变量:define,require,requirejs,其中require === requirejs,一般使用require更简短 define 从名字就可以看出 ...
jQuery 对AMD的支持（Require.js中如何使用jQuery）
AMD 模块 AMD(异步模块定义,Asynchronous Module Definition)格式总体的目标是为现在的开发者提供一个可用的模块化 JavaScript 的解决方案. AMD 模块格 ...
5月学习总结（Ant-Design，mustache，require.js，grunt）
一.Ant-Design学习因为Ant-Design是基于React实现的,之前自己也学过一段时间的React,对React还是相对比较熟悉的,在学习Ant-Design也还不算吃力. 最开始是从源 ...
electron 解压zip_node.js实现简单的压缩/解压缩功能示例
本文实例讲述了node.js实现简单的压缩/解压缩功能.分享给大家供大家参考,具体如下: 压缩的例子非常简单的几行代码,就完成了本地文件的gzip压缩. var fs = require('fs') ...
javascript基础修炼——手把手教你造一个简易的require.js
require.js造轮子示例代码托管在我的代码仓:http://www.github.com/dashnowords/blogs 一. 概述许多前端工程师沉浸在使用脚手架工具的快感中,认为req ...

require.js 的简单运用 --兰

require.js 的简单运用 --兰相关推荐

最新文章

热门文章