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插件之easing 动态菜单
Aug 21 Javascript
jQuery编写widget的一些技巧分享
Oct 28 Javascript
JavaScript 高级篇之函数 (四)
Apr 07 Javascript
jQuery DateTimePicker 日期和时间插件示例
Jan 22 Javascript
js实现悬浮窗效果(支持拖动)
Mar 09 Javascript
JS中正则表达式全局匹配模式 /g用法详解
Apr 01 Javascript
详解Chai.js断言库API中文文档
Jan 31 Javascript
JavaScript异步加载问题总结
Feb 17 Javascript
vue与原生app的对接交互的方法(混合开发)
Nov 28 Javascript
小程序如何构建骨架屏
May 29 Javascript
微信小程序实现批量倒计时功能
Nov 01 Javascript
基于Vue中使用节流Lodash throttle详解
Oct 30 Javascript
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
substr()函数中文版
2006/10/09 PHP
php中多维数组按指定value排序的实现代码
2014/08/19 PHP
wordpress自定义标签云与随机获取标签的方法详解
2019/03/22 PHP
Thinkphp 3.2框架使用Redis的方法详解
2019/10/24 PHP
Laravel Reponse响应客户端示例详解
2020/09/03 PHP
javascript网页关键字高亮代码
2008/07/30 Javascript
JavaScript基本编码模式小结
2012/05/23 Javascript
深入Javascript函数、递归与闭包(执行环境、变量对象与作用域链)使用详解
2013/05/08 Javascript
Javascript学习笔记之 对象篇(四) : for in 循环
2014/06/24 Javascript
js控制鼠标事件移动及移出效果显示
2014/10/19 Javascript
jQuery siblings()用法实例详解
2016/04/26 Javascript
手机端实现Bootstrap简单图片轮播效果
2016/10/13 Javascript
Vue0.1的过滤代码如何添加到Vue2.0直接使用
2017/08/23 Javascript
vue如何进行动画的封装
2018/09/26 Javascript
iview实现select tree树形下拉框的示例代码
2018/12/21 Javascript
VUE实现Studio管理后台之鼠标拖放改变窗口大小
2020/03/04 Javascript
使用python搭建Django应用程序步骤及版本冲突问题解决
2013/11/19 Python
Python网络编程之TCP套接字简单用法示例
2018/04/09 Python
Python理解递归的方法总结
2019/01/28 Python
python实现顺时针打印矩阵
2019/03/02 Python
Python除法之传统除法、Floor除法及真除法实例详解
2019/05/23 Python
使用python telnetlib批量备份交换机配置的方法
2019/07/25 Python
Python paramiko模块使用解析(实现ssh)
2019/08/30 Python
用python解压分析jar包实例
2020/01/16 Python
Python可变对象与不可变对象原理解析
2020/02/25 Python
Numpy一维线性插值函数的用法
2020/04/22 Python
appium+python自动化配置(adk、jdk、node.js)
2020/11/17 Python
柒牌官方商城:中国男装优秀品牌
2017/06/30 全球购物
英国的领先快速时尚零售商:In The Style
2019/03/25 全球购物
公益活动策划方案
2014/01/09 职场文书
2015年度班主任自我评价
2015/03/11 职场文书
2015年骨干教师工作总结
2015/05/26 职场文书
建党伟业观后感
2015/06/01 职场文书
领导视察通讯稿
2015/07/18 职场文书
Python数据分析之绘图和可视化详解
2021/06/02 Python
python开发的自动化运维工具ansible详解
2021/08/07 Python