zoukankan      html  css  js  c++  java
  • JS模块化库seajs体验

    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,更加直接,使用更加简单。

  • 相关阅读:
    Realtime crowdsourcing
    maven 常用插件汇总
    fctix
    sencha extjs4 command tools sdk
    首次吃了一颗带奶糖味的消炎药,不知道管用不
    spring mvc3 example
    ubuntu ati driver DO NOT INSTALL recommand driver
    yet another js editor on windows support extjs
    how to use springsource tools suite maven3 on command
    ocr service
  • 原文地址:https://www.cnblogs.com/lightsong/p/5582366.html
Copyright © 2011-2022 走看看