一、RequireJS的主要作用与优点

主要作用:js模块化、编写复用js代码

优点:

1、防止命名冲突

2、声明不同js文件之间的依赖

3、代码模块化

(1)一个文件一个模块:每个js文件应该只定义一个模块

(2)define()中注意相对模块名

二、常用方法

1、require.config  为模块指定别名

2、require           引入写好的模块

3、define            编写模块

三、使用方法+一个小例子

模块js写在html外面,由一个js进行模块加载

例如我的工程目录结构

|  src

|   |——  js

|—— main.js

|—— test.js

|  vender

|   |——  js

|—— require.min.js

|—— jquery.min.js

|

|  test.html

一个 Demo test.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>一个Require Test</title>
<style> #myTest{
height: 50px;;
width: 50px;
background-color: #28a4c9;
text-align: center;
}
</style>
</head>
<body>
<div id="myTest">Test</div>
<script src="vender/js/require.min.js" data-main="src/js/main"></script>
</body>
</html>

|—— main.js

require.config({
paths:{
jquery: '../../vender/js/jquery.min'
}
});
require(['jquery','test'],function($,test){
test.fun1();
$('#myTest').click(function(){
console.log('myTest click2');
});
});

|—— test.js

define(['jquery'],function($){
return {
fun1:function(){
$('#myTest').click(function(){
console.log('myTest click');
});
}
}
})

RequireJS的简单应用的更多相关文章

  1. seaj和requirejs模块化的简单案例

    如今,webpack.gulp等构件工具流行,有人说seajs.requirejs等纯前端的模块化工具已经被淘汰了,我不这么认为,毕竟纯前端领域想要实现模块化就官方来讲,还是有一段路要走的.也因此纯前 ...

  2. RequireJS 快速入门

      说明:本文只提供快速入门内容,方便快速进入实战状态.更高级的配置,请参考官网文档. 当初之所以使用 RequireJS 等工具,是因为想提高js的加载速度,避免不必要的堵塞.但通过一段时间的使用, ...

  3. RequireJS 基础(一)

    RequireJS由James Burke创建,他也是AMD规范的创始人. RequireJS会让你以不同于往常的方式去写JavaScript,你将不再使用script标签在HTML中引入JS文件,以 ...

  4. requireJs和r.js压缩工具

    上面release是执行命令 node r.js -o build.js 生成的,需要切换到目录require/tools下面,也就是 有r.js和build.js的目录,才能执行命令 代码目录如上: ...

  5. RequireJS入门(一) 转

    RequireJS由James Burke创建,他也是AMD规范的创始人. RequireJS会让你以不同于往常的方式去写JavaScript.你将不再使用script标签在HTML中引入JS文件,以 ...

  6. RequireJS入门与进阶

    RequireJS由James Burke创建,他也是AMD规范的创始人. RequireJS会让你以不同于往常的方式去写JavaScript.你将不再使用script标签在HTML中引入JS文件,以 ...

  7. RequireJS入门(一)

    RequireJS由James Burke创建,他也是AMD规范的创始人. RequireJS会让你以不同于往常的方式去写JavaScript.你将不再使用script标签在HTML中引入JS文件,以 ...

  8. 30分钟 带你浅入requirejs源码

    因为最近项目想现实一个单页功能,用的是react ,然后看了一下react route,挖槽 gzip后16k? 然后我简单写了一个纯单页(不支持多页的单页,所有入口都经过rewrite跑到index ...

  9. hdjs---后盾网requireJS课程

    hdjs---后盾网requireJS课程 一.总结 一句话总结: requireJS是js端模块化开发,主要是实现js的异步加载,和管理模块之间的依赖关系,便于代码的编写和维 1.requireJS ...

随机推荐

  1. A+B Problem(V)

    描述 做了A+B Problem之后,Yougth感觉太简单了,于是他想让你求出两个数反转后相加的值.帮帮他吧 输入 有多组测试数据.每组包括两个数m和n,数据保证int范围,当m和n同时为0是表示输 ...

  2. jqcss选择器

    $("p").css("background-color","red"); $(this) 当前 HTML 元素$("p" ...

  3. jQuery插件面向对象开发

    为什么要有面向对象的思维,因为如果不这样,你可能需要一个方法的时候就去定义一个function,当需要另外一个方法的时候,再去随便定义一个function,同样,需要一个变量的时候,毫无规则地定义一些 ...

  4. python(3)-队列

    队列分为双向队列和单向队列: 对于双向队列,同样需要先import collections 创建队列 >>> import collections >>> d = ...

  5. Linux 通过 load average 判断服务器负载情况

    Linux中load average判断服务器负载情况 转载文章 http://www.111cn.net/sys/linux/56003.htm 写的比较详细,推荐看看.

  6. mysql输出的错误提示是法语

    参考MySQL用户手册 http://dev.mysql.com/doc/refman/5.5/en/error-message-language.html mysql.ini 文件里头有一个参数叫做 ...

  7. [改善Java代码]断言绝对不是鸡肋

    建议19: 断言绝对不是鸡肋 在防御式编程中经常会用断言(Assertion)对参数和环境做出判断,避免程序因不当的输入或错误的环境而产生逻辑异常,断言在很多语言中都存在,C.C++.Python都有 ...

  8. poj 3678 2-SAT问题

    思路:将每个点拆分为两个点 a与a' ,a表示为1,a'表示为0.那么条件给的每个边自然就会存在矛盾,然后根据2-SAT建边就行了. #include<iostream> #include ...

  9. (转)linuxmint,ubuntu 下修改guake宽度方法

    之前在网上找到修改guake.py的方式,但是我一直没能找到guake.py的文件,弄的我纠结,后来找到这个文章,这个确实是有效果的 Ubuntu12.04上Guake在唤出的时候滚动条会消失,主要原 ...

  10. JMS - ExceptionListener

    If a JMS provider detects a problem with a connection, it will inform the connection’s ExceptionList ...