测试结构如下

index.html

 <!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script data-main="js/app.js" src="https://cdn.bootcss.com/require.js/2.3.5/require.js"></script>
</head> <body> <!--
版本优化:默认有引入,例如用了jq,就会默认要求加入jquery.js,无需配置.
--> <button id="require">点击require确定啊</button> <input type="text" id="date3" data-options="{'type':'YYYY-MM-DD hh:mm','beginYear':2010,'endYear':2088}" style="width:166px;height:19px;"> </body> </html>

app.js

 requirejs.config({
// 默认项目地址
baseUrl: 'js/lib', // 路径(可本地可网络)-去除后缀(默认.js),数组可填写多个路径,为了防止cdn突然失效
paths: {
'jquery': ['jquery', 'https://cdn.bootcss.com/jquery/3.3.1/jquery.min'],
'jquery.date': ['jquery.date'],
'math': ['../math']
}, // 依赖(jquery.date就依赖于jquery)
shim: {
'jquery.date': {
deps: ['jquery'],
exports: 'jQuery.fn.date'
}
}, // 控制插件依赖->jq($)
// map: {
// '*': { 'jquery': 'jquery.date' },
// 'jquery.date': { 'jquery': 'jquery' }
// }, // 控制版本号
urlArgs: 'ver=0.0.1', // 请求等待时间
waitSeconds: 10
}); // app.js可以直接写function和用.
function addCount(x, y) {
return x, y;
} requirejs(["jquery", "jquery.date"],
function ($) {
// 逻辑代码
$('#require').on('click', function () {
console.log('hehei');
});
// 初始化日期
$.date('#date3'); console.log($);
}
); // 使用外部的js呢?(很抱歉,得另起一行了)
 require(['math'], function (math) {
alert(math.add(1, 1));
});

资料参考于:https://blog.csdn.net/bluesky1215/article/details/71079667http://www.requirejs.cn/

require.js - 详解的更多相关文章

  1. require.js详解

    一:什么是require.js ①:require.js是一个js脚本加载器,它遵循AMD(Asynchronous Module Definition)规范,实现js脚本的异步加载,不阻塞页面的渲染 ...

  2. dev-server.js详解

    转载自:https://www.cnblogs.com/ye-hcj/p/7091706.html dev-server.js详解 require('./check-versions')() var ...

  3. webpack.dev.conf.js详解

    转载自:https://www.cnblogs.com/ye-hcj/p/7087205.html webpack.dev.conf.js详解 //引入当前目录下的utils.js文件模块var ut ...

  4. 【three.js详解之一】入门篇

    [three.js详解之一]入门篇   开场白 webGL可以让我们在canvas上实现3D效果.而three.js是一款webGL框架,由于其易用性被广泛应用.如果你要学习webGL,抛弃那些复杂的 ...

  5. 【three.js详解之二】渲染器篇

    [three.js详解之二]渲染器篇   本篇文章将详细讲解three.js中渲染器(renderer)的设置方法. three.js文档中渲染器的分支如下: Renderers CanvasRend ...

  6. [js高手之路]深入浅出webpack系列2-配置文件webpack.config.js详解

    接着上文,重新在webpack文件夹下面新建一个项目文件夹demo2,然后用npm init --yes初始化项目的package.json配置文件,然后安装webpack( npm install ...

  7. [js高手之路]深入浅出webpack教程系列3-配置文件webpack.config.js详解(下)

    本文继续接着上文,继续写下webpack.config.js的其他配置用法. 一.把两个文件打包成一个,entry怎么配置? 在上文中的webpack.dev.config.js中,用数组配置entr ...

  8. [js高手之路]深入浅出webpack教程系列2-配置文件webpack.config.js详解(上)

    [js高手之路]深入浅出webpack教程系列索引目录: [js高手之路]深入浅出webpack教程系列1-安装与基本打包用法和命令参数 [js高手之路]深入浅出webpack教程系列2-配置文件we ...

  9. JS 详解 Cookie、 LocalStorage 与 SessionStorage-转载

    记录一下这些知识,有时候用到会忘记,对原文作者表达感谢. 附上原文链接:JS 详解 Cookie. LocalStorage 与 SessionStorage 基本概念 Cookie Cookie 是 ...

随机推荐

  1. 正则表达式、re、常用模块

    阅读目录 正则表达式 字符 量词 . ^ $ * + ? { } 字符集[][^] 分组 ()与 或 |[^] 转义符 \ 贪婪匹配 re 总结 正则 re 常用模块 namedtuple deque ...

  2. 通过docker info命令,可以了解很多信息

    来个输出吧. Containers: 1 Running: 1 Paused: 0 Stopped: 0 Images: 1 Server Version: 17.03.1-ce Storage Dr ...

  3. 【cocos2d-js官方文档】十一、cc.path

    概述 该单例是为了方便开发者操作文件路径所设计的.定义为cc.path的目的是为了跟nodejs的path保持一致.里面定义的api也基本跟nodejs的path模块一致,但不全有,今后可能还会继续根 ...

  4. 【cocos2d-js官方文档】九、cc.loader

    概述 原来的cc.Loader被改造为一个单例cc.loader,采用了插件机制设计,让loader做更纯粹的事. 各种资源类型的loader可以在外部注册进来,而不是直接将所有的代码杂揉在cc.Lo ...

  5. [ThinkPHP] 从一个表中获得栏目对应的ID,从另一个表获得属于这些栏目的文章

    public function index(){ $cate = 1; $query = M('Cate')->field('id')->where(array('id'=>$cat ...

  6. android9.0请求异常

    抛出异常:CLEARTEXT communication to not permitted by network security policy android 9开始默认不能使用http 1.在re ...

  7. ZOJ 3332 Strange Country II (竞赛图构造哈密顿通路)

    链接:http://www.icpc.moe/onlinejudge/showProblem.do?problemCode=3332 本文链接:http://www.cnblogs.com/Ash-l ...

  8. Python练习——同时安装python2 与 python 3如何选择不同解释器运行脚本

    如果同时安装了python 2 和python 3 那么我们需要在运行时指定解释器 如下: 其中py -2 ex1.py指定了解释器的版本,以及打开的文件 如果使用 py-3 ex1.py则使用了py ...

  9. mysql实现full outer join

    由于MySQL设计时不支持full outer join, 所以如果有全连接需求时,需要一点小技巧来实现. 假设有两个表t1,t2 full outer join 的效果和下面的效果一样: SELEC ...

  10. [CF235E]Number Challenge

    $\newcommand{fl}[1]{\left\lfloor#1\right\rfloor}$题意:求$\sum\limits_{i=1}^a\sum\limits_{j=1}^b\sum\lim ...