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

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

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

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

2、requirejs路径解析

代码结构为:

示例代码:

index.html

  1. <!doctype html>
  2. <html lang="en">
  3.  
  4. <head>
  5. <meta charset="UTF-8" />
  6. <title>Document</title>
  7. </head>
  8.  
  9. <body>
  10. <!--data-main 是入口文件js/main.js js/main都行-->
  11. <script src="js/require.js" type="text/javascript" charset="utf-8" data-main="js/main"></script>
  12. </body>
  13.  
  14. </html>

main.js为

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

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

baseUrl默认为main.js的路径

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

  1. jquery的路径为:js/jquery-1.12.4.min
  2.  
  3. 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. python 日历(Calendar)模块

    另附一篇文章:http://www.jb51.net/article/77971.htm 序号 函数及描述 1. calendar.calendar(year,w=2,l=1,c=6) 返回一个多行字 ...

  2. ElasticSearch Mapping中的字段类型

    1)string: 默认会被分词 2)数字类型主要如下几种: long:64位存储  integer:32位存储  short:16位存储  byte:8位存储  double:64位双精度存储  f ...

  3. 【BZOJ 3669】 3669: [Noi2014]魔法森林 (动态spfa)

    3669: [Noi2014]魔法森林 Description 为了得到书法大家的真传,小E同学下定决心去拜访住在魔法森林中的隐士.魔法森林可以被看成一个包含个N节点M条边的无向图,节点标号为1..N ...

  4. 设计模式之State模式

    State模式定义: 允许一个对象在状态改变是,改变它的行为.看起来对象似乎修改了它的类. 模式理解(个人): State模式主要解决的事在开发中时常遇到的根据不同状态需要进行不同的处理操作的问题,而 ...

  5. [BZOJ4819][SDOI2017]新生舞会(分数规划+费用流,KM)

    4819: [Sdoi2017]新生舞会 Time Limit: 10 Sec  Memory Limit: 128 MBSubmit: 1097  Solved: 566[Submit][Statu ...

  6. JZYZOJ1457 [NOIP2016]换教室 期望dp 动态规划 floyd算法 最短路

    http://172.20.6.3/Problem_Show.asp?id=1457 我不知道为什么我倒着推期望只有80分,所以我妥协了,我对着题解写了个正的,我有罪. #include<cst ...

  7. 【20181023T2】行星通道计划【二维BIT】

    题面 [错解] 唉好像有规律啊(x2>x1,y2>y1) 唉好像是个偏序啊 然后上CDQ套树状数组 唉怎么大样例跑了十多秒啊 可能有问题吧-- 刷刷刷把T3写了,回来 唉怎么写了个memc ...

  8. Luogu P4093 [HEOI2016/TJOI2016]序列 dp套CDQ

    题面 好久没写博客了..最近新学了CDQ...于是就来发一发一道CDQ的练习题 看上去就是可以dp的样子. 设\(dp_{i}\)为以i结尾的最长不下降序列. 易得:\(dp_{i}\)=\(max( ...

  9. 【高斯消元解xor方程】BZOJ1923-[Sdoi2010]外星千足虫

    [题目大意] 有n个数或为奇数或为偶数,现在进行m次操作,每次取出部分求和,告诉你这几次操作选取的数和它们和的奇偶性.如果通过这m次操作能得到所有数的奇偶性,则输出进行到第n次时即可求出答案:否则输出 ...

  10. Redis简单入门认识

    写在前面: 最近一直都在按照老大的学习路线来进行学习,这几天看了下redis,从刚开始的摸不着头脑,到后面慢慢的查资料,对其逐渐有了简单的了解,也通过一个与ssm框架整合的小demo去动手实践 了,知 ...