1、requirejs遵循AMD规范,将需要的都加载好(前置加载)。注:cmd是就近加载。

define(['jQuery','dialog'],function($,d){
// 业务逻辑
})

(1)AMD采用异步加载,模块的加载不影响它后面语句的执行。

(2)所有依赖这个模块的语句,都定义在一个回调函数中,等前面需要加载的模块加载完成后这个回调函数才运行,解决了依赖性的问题

2、requirejs路径解析

代码结构为:

示例代码:

index.html

<!doctype html>
<html lang="en"> <head>
<meta charset="UTF-8" />
<title>Document</title>
</head> <body>
<!--data-main 是入口文件js/main.js js/main都行-->
<script src="js/require.js" type="text/javascript" charset="utf-8" data-main="js/main"></script>
</body> </html>

main.js为

//配置文件
requirejs.config({
baseUrl:'js/',//默认是main.js所在的文件夹为基准。
paths:{
jquery:'jquery-1.12.4.min'//起个别名
}
}); //加载入口模块
requirejs(['index']);//从基准路径js下开始查找,谨记不能写为index.js

baseUrl指定了一个目录,然后requirejs基于这个目录来寻找依赖的模块。

baseUrl默认为main.js的路径

baseUrl+paths配置路径,如上面的main.js的代码:

jquery的路径为:js/jquery-1.12.4.min

baseURl设置方式有三种

(1)用requirejs.config显示指定baseUrl;

(2)如果指定了Entry Point(data-main)文件,则baseUrl为Entry Point所在目录;

(3)如果上述均未指定,则baseUrl为运行RequireJS的HTML文件所在目录。

模块化开发RequireJS之路径解析的更多相关文章

  1. 模块化开发RequireJS之shim配置

    一.shim requirejs使用AMD规范开发,若开发过程中加载非AMD规范js,需要使用requirejs的shim进行配置. shim配置语法为: //配置文件 requirejs.confi ...

  2. 模块化开发(requireJS)

    模块化 在前端使用模块化开发,可以将代码根据功能实施模块的划分,每个模块功能(职责)单一,在需要更改对应的功能的时候,只需要对指定的模块进行修改,其他模块不受任何影响. 为什么要进行前端模块化? 达到 ...

  3. Javascript模块化开发,使用模块化脚本加载工具RequireJS,提高你代码的速度和质量。

    随着前端JavaScript代码越来越重,如何组织JavaScript代码变得非常重要,好的组织方式,可以让别人和自己很好的理解代码,也便于维护和测试.模块化是一种非常好的代码组织方式,本文试着对Ja ...

  4. 【模块化开发】------requireJS的基本使用------【巷子】

    前言 为了提高代码的复用度,开发人员会按照功能把大量的js代码分成若干文件,这样在多个页面就可以使用同一个文件了.,下面是某个网站的js引用情况 虽然代码的复用度提升了,但是缺点也体现了出来 缺点: ...

  5. Angular 结合RequireJs实现模块化开发

    angular的指令是模块化很好的一个体现,下面我将只使用指令(不用控制器),结合requirejs,实现模块化开发. 模块化关系图:

  6. requirejs:让人迷惑的路径解析

    接触过requirejs的童鞋可能都知道,无论是通过define来定义模块,还是通过require来加载模块,模块依赖声明都是很重要的一步.而其中涉及到的模块路径解析,对于新手来说,有的时候会让人觉得 ...

  7. 在Html中使用Requirejs进行模块化开发

    在前端模块化的时候,不仅仅是js需要进行模块化管理,html有时候也需要模块化管理.这里就介绍下如何通过requirejs,实现html代码的模块化开发. 如何使用requirejs加载html Re ...

  8. 转:requirejs:让人迷惑的路径解析(~~不错)

    接触过requirejs的童鞋可能都知道,无论是通过define来定义模块,还是通过require来加载模块,模块依赖声明都是很重要的一步.而其中涉及到的模块路径解析,对于新手来说,有的时候会让人觉得 ...

  9. [工具配置]使用requirejs模块化开发多页面一个入口js的使用方式

    描述 知道requirejs的都知道,每一个页面需要进行模块化开发都得有一个入口js文件进行模块配置.但是现在就有一个很尴尬的问题,如果页面很多的话,那么这个data-main对应的入口文件就会很多. ...

随机推荐

  1. Spring 概念详解

    一.Spring的IoC(Inversion of Control). 这是Spring中得有特点的一部份.IoC又被翻译成“控制反转”,也不知道是谁翻译得这么别扭,感觉很深奥的词.其实,原理很简单, ...

  2. luogu P1012 拼数

    题目描述 设有n个正整数(n≤20),将它们联接成一排,组成一个最大的多位整数. 例如:n=3时,3个整数13,312,343联接成的最大整数为:34331213 又如:n=4时,4个整数7,13,4 ...

  3. bzoj 1483: [HNOI2009]梦幻布丁

    1483: [HNOI2009]梦幻布丁 Description N个布丁摆成一行,进行M次操作.每次将某个颜色的布丁全部变成另一种颜色的,然后再询问当前一共有多少段颜色.例如颜色分别为1,2,2,1 ...

  4. 详解React的生命周期

    React生命周期 之前自己在学习React的时候,只是简单的理解了生命周期有这么一些,但是不知道大概的一个流程是怎么样的.那天在面试的时候,问到了.自己也有点懵,也没提前看,不过还是答上来了一些,这 ...

  5. spring的@Async异步使用

    pring的@Async功能,用的时候一定要注意: 1.异步方法和调用类不要在同一个类中. 2.xml里需要加入这一行 <task:annotation-driven/> 下面的可以直接粘 ...

  6. 【mysql】mysql中varcher属性最大值能存多长

    1.首先理解varchar(n),n表示什么 MySQL5.0.3之前varchar(n)这里的n表示字节数 MySQL5.0.3之后varchar(n)这里的n表示字符数,比如varchar(200 ...

  7. 轻量级web服务器lighttpd的编译及配置(for x86-linux)

    转自:http://blog.163.com/ljf_gzhu/blog/static/131553440201211522317367/ 备注: PC Linux:Ubuntu-10.10 Linu ...

  8. Android 自己收集的开源项目集合(持续更新 2018.2.5)

    2017.12.21 1.仿QQ说说发图片选择框架 https://github.com/yaozs/ImageShowPicker 2.炫酷开屏动画框架 https://github.com/Jos ...

  9. C++中try_catch_throw的做异常处理

    C++中try_catch_throw的做异常处理 选择异常处理的编程方法的具体原因如下: . 把错误处理和真正的工作分开来: . 代码更易组织,更清晰,复杂的工作任务更容易实现: . 毫无疑问,更安 ...

  10. tensorflow c++ API加载.pb模型文件并预测图片

    tensorflow  python创建模型,训练模型,得到.pb模型文件后,用c++ api进行预测 #include <iostream> #include <map> # ...