seajs

http://seajs.org/docs/en.html#intro

https://github.com/seajs/seajs/releases

Extremely simple experience of modular development

Why use Sea.js ？

Sea.js's pursuit of a simple, natural coding and organization，has the following key aspects:

  • The definition of a module specification is simple and friendly：Sea.js follow the CMD specification，as the Node.js module style.
  • Natural and intuitive code organization：Automatically load dependence, configuration is simple and clear，so that we can more enjoy coding.

Sea.js provides common plug-ins，they are very helpful for the development of debugging and performance optimization，and has a rich extensible interface.

模块的声明非常 简单 和 友好。

自然和直觉性的代码组织方式。自动依赖下载 和 配置简单明了。

兼容性：

Compatibility

Sea.js has perfect test cases, compatible with all major browsers: 

Chrome 3+         ✔

Firefox 2+        ✔

Safari 3.2+       ✔

Opera 10+         ✔

IE 5.5+           ✔

Sea.js can be run in Mobile terminal，including Hybrid Mode App. In theory, Sea.js can be run in any browser.

CMD

http://wiki.commonjs.org/wiki/Modules/1.1.1

CMD规范模块定义格式

//Inside b.js:

define(function(require, exports, module) {

    //If "a" has used exports, then we have a real

    //object reference here. However, we cannot use

    //any of "a"'s properties until after "b" returns a value.

    var a = require("a");

    exports.foo = function () {

        return a.bar();

    };

});

AMD规范：

http://www.requirejs.org/docs/api.html#funcmodule

//Inside b.js:

define(["require", "a"],

    function(require, a) {

        //"a" in this case will be null if "a" also asked for "b",

        //a circular dependency.

        return function(title) {

            return require("a").doSomething();

        }

    }

);

实验

https://github.com/fanqingsong/code-snippet/tree/master/web/seajs_demo

one.js

//Inside one.js:
define(function(require, exports, module) {
      var two = require('./two.js');

exports.sayHello = function() {
        console.log('one module called');
      };

exports.callTwo = function() {
        two.sayHello();
      };
    }
);

two.js

//Inside two.js:
define(function(require, exports, module) {
      exports.sayHello = function() {
        console.log('two module called');
      };
    }
);

demo.html

<html>
<head>
        <!--This sets the baseUrl to the "scripts" directory, and
            loads a script that will have a module ID of 'main'-->
        <script src="./sea.js"></script>
        <style>

</style>
        <script>
        seajs.use('one', function(one) {
          one.sayHello();
          one.callTwo();
        });
        </script>
</head>
<body>
        <h1>hello world!</h1>
</body>
</html>

相比requirejs，更加直接，使用更加简单。

JS模块化库seajs体验的更多相关文章

  1. Js模块化开发--seajs和gruntJs

    1.Seajs库 解决开发中的冲突依赖等问题,提供代码可维护性. SeaJS 是由玉伯开发的一个遵循 CommonJS 规范的模块加载框架,可用来轻松愉悦地加载任意 JavaScript 模块和css ...

  2. JS模块化规范CMD之SeaJS

    1. 在接触规范之前,我们用模块化来封装代码大多为如下: ;(function (形参模块名, 依赖项, 依赖项) { // 通过 形参模块名 修改模块 window.模块名 = 形参模块名 })(w ...

  3. JS模块化开发：使用SeaJs高效构建页面

    一.扯淡部分 很久很久以前,也就是刚开始接触前端的那会儿,脑袋里压根没有什么架构.重构.性能这些概念,天真地以为前端===好看的页面,甚至把js都划分到除了用来写一些美美的特效别无它用的阴暗角落里,就 ...

  4. JS模块化开发（三）——seaJs+grunt

    1.seaJs直接构建存在的问题 由于模块之间的依赖require引用的是模块名,当多个js模块被合并成一个时,会由于找不到模块名而报错 2.seaJs+grunt开发 用到的插件:grunt-cmd ...

  5. js模块化/js模块加载器/js模块打包器

    之前对这几个概念一直记得很模糊,也无法用自己的语言表达出来,今天看了大神的文章,尝试根据自己的理解总结一下,算是一篇读后感. 大神的文章:http://www.css88.com/archives/7 ...

  6. js模块化AMD、CMD、ES6

    AMD CMD ES6模块化 各个模块化规范对比理解 一.AMD 在上一篇js模块化入门与commonjs解析与应用中详细的解析了关于commonjs模块化规范,commonjs采用的用同步加载方式, ...

  7. 从273二手车的M站点初探js模块化编程

    前言 这几天在看273M站点时被他们的页面交互方式所吸引,他们的首页是采用三次加载+分页的方式.也就说分为大分页和小分页两种交互.大分页就是通过分页按钮来操作,小分页是通过下拉(向下滑动)时异步加载数 ...

  8. js模块化历程

    这是一篇关于js模块化历程的长长的流水账,记录js模块化思想的诞生与变迁,展望ES6模块化标准的未来.经历过这段历史的人或许会感到沧桑,没经历过的人也应该知道这段历史. 无模块时代 在ajax还未提出 ...

  9. AMD and CMD are dead之js模块化黑魔法

    var define, require, define2, require2; typeof JSON != "object" && (JSON = {}), fu ...

随机推荐

  1. ACM: CodeForces 140A New Year Table-数学几何

    CodeForces 140A New Year Table Time Limit:2000MS     Memory Limit:262144KB     64bit IO Format:%I64d ...

  2. 洛谷 洛谷 P1011 车站 Label：续命模拟QAQ 未知50分

    题目描述 火车从始发站(称为第1站)开出,在始发站上车的人数为a,然后到达第2站,在第2站有人上.下车,但上.下车的人数相同,因此在第2站开出时(即在到达第3站之前)车上的人数保持为a人.从第3站起( ...

  3. HDU - The number of divisors(约数) about Humble Numbers

    Description A number whose only prime factors are 2,3,5 or 7 is called a humble number. The sequence ...

  4. 关于url

    URL即统一资源定位器用于定位万维网上的文档或其他数据,URL 可以由单词组成,比如 “www.baidu.com”,或者是因特网协议(IP)地址:192.168.x.xxx.大多数人在网上冲浪时,会 ...

  5. NOI模拟赛 Day1

    [考完试不想说话系列] 他们都会做呢QAQ 我毛线也不会呢QAQ 悲伤ING 考试问题: 1.感觉不是很清醒,有点困╯﹏╰ 2.为啥总不按照计划来!!! 3.脑洞在哪里 4.把模拟赛当作真正的比赛,紧 ...

  6. iOS 上线被拒收集

    根据上线被拒的原因 自己 也在慢慢总结  希望对各位有所帮助 1)QQ 微信 等第三方平台 必须要做是否安装应用的检测

  7. CentOS上使用sysstat做系统监控测试

    先安装sysstat yum -y install systat 然后,再改一下任务计划 [root@localhost sa]# cat /etc/cron.d/sysstat # Run syst ...

  8. JDBC学习笔记2

    数据库数据更新操作statement接口下操作:[代码] import java.sql.DriverManager;import java.sql.SQLException; public clas ...

  9. Base64编码简介

      基本概念   Base64这个术语最初是在“MIME内容传输编码规范”中提出的.Base64不是一种加密算法,虽然编码后的字符串看起来有点加密的赶脚.它实际上是一种“二进制到文本”的编码方法,它能 ...

  10. php归档函数（按时间）实现

    今日开发本站需要用到按时间归档文章的功能,即按文档发布时间将文章文类,以实现检索和统计功能,于是自己写了一个, 现分享给大家,相信大家工作和学习中有可能会用到,实现原理很简单,即取出文章发布时间戳的年 ...