Sea.js - A Module Loader for the Web

Loading ...

Extremely simple experience of modular development

A Module Loader for the Web

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.

The use of Sea.js products

Thanks for the trust and support of the company:

Sea.js follows the MIT, anyone can freely use.

5 minutes to get started

Here is a little game, naughty letters come from the mysterious depths of the sea. When you hover the mouse over them, the letter will rotate to the correct location.
Note: This example is only valid in the advanced browser, such as chrome.
Try it, have a look the effect...

Take 5 minutes to have a look, how to realize this small project.

The directory structure

All source code on the GitHub: seajs/examples. The directory structure is:

examples/
  |-- sea-modules      For seajs,jquery and etc modules
  |-- static           For js, css
  |     |-- hello
  |     |-- lucky
  |     `-- todo
  `-- app              For html
        |-- hello.html
        |-- lucky.html
        `-- todo.html

We start from hello.html, to see how to use the Sea.js organization code.

Load module in the page

At the bottom of hello.html, after script of sea.js, set config：

// seajs config
seajs.config({
  base: "../sea-modules/",
  alias: {
    "jquery": "jquery/jquery/1.10.1/jquery.js"
  }
})

// load main
seajs.use("../static/hello/src/main")

After sea.js download, the main module will auto be loaded, so simple.

Module code

The game has 2 module: spinning.js and main.js, follow the unified standard.

// define a module
define(function(require, exports, module) {

  // require dependence
  var $ = require('jquery');
  var Spinning = require('./spinning');

  // exports interface
  exports.doSomething = ...

  // or exports the only one interface by module.exports
  module.exports = ...

});

This is CMD specification. If you have ever used Node.js, it's simple.

Build and deployment

You can concat and compress the source code before deployment.
Example of using spm or grunt: Building tool

Conclusion

How about it? 5 minutes at most!

By using Sea.js, we can build program standard, process dependence automatic. And it is very helpful to organize code, debug and optimize. I'm sure you will fall in love with it.

More examples：seajs/examples
Documents：Docs

Issues：Community

Documents

This is Sea.js official document.
Please read the based documentation in order, subsequent according to the interest.
Issues: Community

Introduction

Basics

Plug-in

Advanced

Discuss

Community

Sea.js advocate open and free. Welcome to participate in.

About

Sea.js is an open source project, maintain by alibaba and tencent.
Idea: Hiner hundred sichuan, possesses forbearance is big Sea.js expect open and free.

Thanks to my family and friends.

Welcome to support module ecological circle spmjs.io

Best Regards.

Downloads

All version of zip: seajs/releases
After extracting, The catalog description as follows:

dist      -- Sea.js distribute
docs      -- Documents
lib       -- For Node.js
src       -- Source
tests     -- The test set
Makefile  -- Build, test commands

Recommend install by spm:

$ npm install spm -g
$ spm install seajs

The latest version

2014-06-10 Release Sea.js 2.3.0 Downloads