RequireJS用法简单示例


Posted in Javascript onAugust 20, 2018

本文实例讲述了RequireJS用法。分享给大家供大家参考,具体如下:

建立如下工程目录:

|-test

   |-index.html

   |-index.js

   |-main.js

   |-require.min.js

   |-test.js

其中,index.html如下:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Index</title>
</head>
<body>
<script type="text/javascript" data-main="main.js" src="require.js"></script>
</body>
</html>

data-main为入口。

main.js如下:

define(['require','main'],function (require) {
  require(['index','test'],function (index,test) {
    console.log(index.index());
    console.log(test.test());
  });
});

index.js如下:

define(['require','index'],function (require) {
  var index = {
    index:function () {
      console.log("index");
    }
  };
  return index;
});

test.js如下:

define(['require','test'],function (require) {
  var test = {
    test:function () {
      console.log("test");
    }
  };
  return test;
});

当要简单包装CommonJS来定义模块,则main.js改为:

define(function(require, exports, module) {
    var index = require('index');
    var test = require('test');
  }
);

即可引入index.js 和 test.js。

希望本文所述对大家RequireJS程序设计有所帮助。

Javascript 相关文章推荐
jquery 插件 任意位置浮动固定层
Dec 25 Javascript
jQuery带进度条全屏图片轮播特效代码分享
Jun 28 Javascript
JS+CSS实现的漂亮渐变背景特效代码(6个渐变效果)
Mar 25 Javascript
jQuery fadeOut 异步实例代码详解
Aug 18 Javascript
Vue.js结合bootstrap实现分页控件
Mar 10 Javascript
Node.js利用debug模块打印出调试日志的方法
Apr 25 Javascript
Vue2.x中的父子组件相互通信的实现方法
May 02 Javascript
理顺8个版本vue的区别(小结)
Sep 17 Javascript
axios全局注册,设置token,以及全局设置url请求网段的方法
Sep 25 Javascript
vue滚动插件better-scroll使用详解
Oct 18 Javascript
js回调函数仿360开机
Dec 26 Javascript
vue项目两种方式实现竖向表格的思路分析
Apr 28 Vue.js
JavaScript实现多态和继承的封装操作示例
Aug 20 #Javascript
浅谈微信小程序之官方UI框架we-ui使用教程
Aug 20 #Javascript
Layui给数据表格动态添加一行并跳转到添加行所在页的方法
Aug 20 #Javascript
微信小程序 MinUI组件库系列之badge徽章组件示例
Aug 20 #Javascript
获取layer.open弹出层的返回值方法
Aug 20 #Javascript
react.js组件实现拖拽复制和可排序的示例代码
Aug 20 #Javascript
layui弹出层按钮提交iframe表单的方法
Aug 20 #Javascript
You might like
第1次亲密接触PHP5(1)
2006/10/09 PHP
php生成扇形比例图实例
2013/11/06 PHP
php常量详细解析
2015/10/27 PHP
PHP常用算法和数据结构示例(必看篇)
2017/03/15 PHP
thinkPHP5框架自定义验证器实现方法分析
2018/06/11 PHP
Javascript技术技巧大全(五)
2007/01/22 Javascript
javascript学习笔记(十六) 系统对话框(alert、confirm、prompt)
2012/06/20 Javascript
node.js中的emitter.emit方法使用说明
2014/12/10 Javascript
javascript面向对象程序设计(一)
2015/01/29 Javascript
JavaScript SHA512&amp;SHA256加密算法详解
2015/08/11 Javascript
浅析JavaScript 调试方法和技巧
2015/10/22 Javascript
Ajax实现不刷新取最新商品
2017/03/01 Javascript
微信小程序多张图片上传功能
2017/06/07 Javascript
简单实现js放大镜效果
2017/07/24 Javascript
jQuery实现的电子时钟效果完整示例
2018/04/28 jQuery
在vue中实现点击选择框阻止弹出层消失的方法
2018/09/15 Javascript
原生JS实现列表内容自动向上滚动效果
2019/05/22 Javascript
[07:03]显微镜下的DOTA2第九期——430圣堂刺客杀戮秀
2014/06/20 DOTA
[44:33]EG vs Liquid 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
跟老齐学Python之Python文档
2014/10/10 Python
python3.6 +tkinter GUI编程 实现界面化的文本处理工具(推荐)
2017/12/20 Python
python实现远程通过网络邮件控制计算机重启或关机
2018/02/22 Python
python中matplotlib的颜色及线条控制的示例
2018/03/16 Python
OpenCV HSV颜色识别及HSV基本颜色分量范围
2019/03/22 Python
python 浮点数四舍五入需要注意的地方
2020/08/18 Python
纯CSS3编写的的精美动画进度条(无flash/无图像/无脚本/附源码)
2013/01/07 HTML / CSS
Farah官方网站:男士服装及配件
2019/11/01 全球购物
意大利单身交友网站:Meetic
2020/07/12 全球购物
如何处理简单的PHP错误
2015/10/14 面试题
Java TransactionAPI (JTA) 主要包含几部分
2012/12/07 面试题
EJB面试题
2015/07/28 面试题
中文专业毕业生自荐信
2013/10/28 职场文书
偷看我的初中毕业鉴定
2014/01/29 职场文书
车辆管理制度范本
2015/08/05 职场文书
青年教师听课心得体会
2016/01/15 职场文书
Go中使用gjson来操作JSON数据的实现
2022/08/14 Golang