一、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. Ruby on Rails Tutorial 第三章 静态页面

    1.生成静态页面 $ rails generate controller StaticPages home help    #生成主页和帮助页面的路由.控制器及静态页面 $ rails destroy ...

  2. Android中常用适配器及定义自己的适配器

    转载:http://blog.chinaunix.net/uid-11898547-id-3303153.html http://www.tudou.com/home/_328390108/item ...

  3. RPC框架Thrift例子-PHP调用C++后端程序

    更新 2016-02-22: Response对象不用主动创建. 前言 前段时间用了一下Facebook的开源RPC框架Thrift,做PHP客户端调用C++后端程序,真心觉得Thrift不错! 本文 ...

  4. 关于mybatis用mysql时，插入返回自增主键的问题

    公司决定新项目用mybatis,虽然这个以前学过但是一直没用过都忘得差不多了,而且项目比较紧,也没时间去系统点的学一学,只好很粗略的百度达到能用的程度就行了. 其中涉及到插入实体要求返回主键id的问题 ...

  5. JMS笔记(二)

    接上篇 JMS笔记(一),启动ActiveMQ后,打开http://127.0.0.1:8161/admin管理界面,用户名admin密码admin,点击上面的Queues菜单,创建一个q_test_ ...

  6. Scala中的If判断&While&For循环

    If 判断: object TestScalaIf { def main(args: Array[String]): Unit = { // val resutlt = judge1(-100) // ...

  7. [改善Java代码]三元操作符的类型务必一致

    建议三: 三元操作符是if-else的简化写法,在项目中使用它的地方很多,也非常好用,但是好用又简单的东西并不表示就可以随便用,我们来看看下面这段代码: public class Client { p ...

  8. poj 3250 栈应用

    #include<iostream> #include<cstring> #include<algorithm> #include<cstdio> #d ...

  9. 嵌入式开发笔记 - U-Boot相关

    1.U-boot使用准备 1.1 U-boot下载 通过德国的denx软件中心提供的FTP下载合集,下载网址: ftp://ftp.denx.de/pub/u-boot/

  10. C++函数学习笔记

    C++继承了C语言的全部语法,也包括函数的定义和使用方法. 调用其他函数的函数因为位高权重被尊称为主调函数,被其他函数调用的函数称为被调函数. 函数的返回值由return语句给出,return 表达式 ...