http://localhost/seajs/index.html

<!doctype html>

<head>

<title>Hello Seajs</title>

    <script src="sea.js"></script>

    <script>

        seajs.config({

          // 调试模式

          debug: true,

          // Sea.js 的基础路径

          base: 'http://localhost/seajs/app',

          // 别名配置

          alias: {

                "jquery": "jquery/jquery"

          },

          // 文件编码

          charset: 'utf-8'

        });

    </script>

    <script>

            //执行模块

            seajs.use("app.js");

    </script>

</head>

<body>

    <div id="hello-seajs" >Hello SeaJS</div>

</body>

</html>

http://localhost/seajs/app/jquery/jquery.js

http://localhost/seajs/app/app.js

define(function(require,exports,module){

    var $ = require("jquery");

     // 引入util模块的接口

     var util = require('./util');

     //var helloSeaJS = document.getElementById('hello-seajs');

     // 调用接口的方法

     //helloSeaJS.style.color = util.randomColor();

     var helloSeaJS = $("#hello-seajs");

     helloSeaJS.css("color",util.randomColor());

});

http://localhost/seajs/app/util.js

define(function(require,exports,module){

     var util = {};

     var colorRange = ['0','1','2','3','4','5','6','7','8','9','A','B','C','D','E','F'];

     util.randomColor = function(){

          return '#' +

               colorRange[Math.floor(Math.random() * 16)] +

               colorRange[Math.floor(Math.random() * 16)] +

               colorRange[Math.floor(Math.random() * 16)] +

               colorRange[Math.floor(Math.random() * 16)] +

               colorRange[Math.floor(Math.random() * 16)] +

               colorRange[Math.floor(Math.random() * 16)];

     };

     module.exports = util;

});
base添加规则

  • 完整的绝对路径 不会加base

  • 以 "." 开头 会相对于当前（被调用的）模块解析地址。 如果不存在被调用的模块（如seajs.use() ）， 则会相对于当前页面解析地址。

  • 以 "/" 开头 相对于当前页面的根目录 解析地址

  • 普通命名 直接加上base前缀

base值

  • base 默认值是 seajs所在目录

  • seajs.config()中base的解析与ID命名解析规则相同

例如:

http://example.com/test/js/sea/sea.js

http://example.com/test/index.html

在index.html中调用了sea.js

base的默认值为 "http://example.com/test/js/sea/"

如果使用seajs.config()设置了base

seajs.config({

    base: "home"  // base值为 "http://example.com/test/js/sea/home"

});

seajs.confg({

    base: "./home"  // base值为 "http://example.com/test/home"

});

seajs.conifg({

    base: "/home"   // base值为 "http://example.com/home"

});

seajs hello world的更多相关文章

  1. seaJs学习笔记2 – seaJs组建库的使用

    原文地址:seaJs学习笔记2 – seaJs组建库的使用 我觉得学习新东西并不是会使用它就够了的,会使用仅仅代表你看懂了,理解了,二不代表你深入了,彻悟了它的精髓. 所以不断的学习将是源源不断. 最 ...

  2. 初学seaJs模块化开发，利用grunt打包，减少http请求

    原文地址:初学seaJs模块化开发,利用grunt打包,减少http请求 未压缩合并的演示地址:demo2 学习seaJs的模块化开发,适合对seajs基础有所了解的同学看,目录结构 js — —di ...

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

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

  4. seajs的使用

    写在前面 seajs是什么? Seajs是一个js文件加载器. 遵循 CMD 规范模块化开发,依赖的自动加载.配置的简洁清晰. 用于Web开发的模块加载工具,提供简单.极致的模块化体验 一:使用 文件 ...

  5. 用spm2构建seajs项目的过程

    前言 Javascript模块化规范有CommonJs规范,和主要适用于浏览器环境的AMD规范,以及国内的CMD规范,它是SeaJs遵循的模块化规范.因为以前项目中用SeaJs做过前端的模块管理工具, ...

  6. jquery插件封装成seajs模块

    jquery直接在html中引入. jquery插件修改为: define(function (require, exports, moudles) { return function (jquery ...

  7. 快速上手seajs——简单易用Seajs

    快速上手seajs——简单易用Seajs   原文  http://www.cnblogs.com/xjchenhao/p/4021775.html 主题 SeaJS 简易手册 http://yslo ...

  8. seajs学习一天后的总结归纳

    公司项目最近需要将js文件迁移到seajs来进行模块化管理,由于我以前主要接触模块化开发是接触的AMD规范的requireJS,没有接触过CMD规范,而且在实际项目中还没有用过类似技术.于是,我非常兴 ...

  9. RequireJS与SeaJS模块化加载示例

    web应用越变的庞大,模块化越显得重要,尤其Nodejs的流行,Javascript不限用于浏览器,还用于后台或其他场景时,没有Class,没有 Package的Javascript语言变得难以管理, ...

  10. 新手 gulp+ seajs 小demo

    首先,不说废话,它的介绍和作者就不在多说了,网上一百度一大堆: 我在这里只是来写写我这2天抽空对seajs的了解并爬过的坑,和实现的一个小demo(纯属为了实现,高手请绕道); 一.环境工具及安装 1 ...

随机推荐

  1. 备忘：mybatis 3的使用记录

    这是一篇记录.mybatis是一个部分模仿ORM的framework.是一个介于ORM和原始JDBC的框架.既可以提供ORM的操作对象的特性,又能从详细地控制最终的SQL.达到一个平衡.我们还是得写s ...

  2. Jquery自定义插件之$.extend()、$.fn和$.fn.extend()

    jquery插件的种类: 1.对象级别的插件开发,即给jQuery对象添加方法,封装对象方法的插件,如:parent().appendTo() 2.一种是类级别的插件开发,即给jQuery添加新的全局 ...

  3. 使用VelocityTracker来完成MotionEvent移动速率计算

    先看效果图 关键代码(此处记录单点): switch (event.getAction()){ case MotionEvent.ACTION_DOWN: if (veloctiy==null) { ...

  4. UISearchBar控件-让我们来搞定！（转）

    转载自:http://blog.sina.com.cn/s/blog_7b9d64af0101dfg8.html     最近用到搜索功能.于是,经过不断的研究,终于,有点懂了. 那就来总结一下吧,好 ...

  5. Ubuntu16.04/LinuxMint18安装openjdk-7-jdk

    LinuxMint18的安装源已经默认没有openjdk7了,所以要自己手动添加仓库,如下: sudo add-apt-repository ppa:openjdk-r/ppa sudo apt-ge ...

  6. redis源码安装

    #安装目录 mkdir -p /data/apps/redis cd /data/tgz wget http://download.redis.io/releases/redis-3.2.1.tar. ...

  7. [转]C#反射-Assembly.Load、LoadFrom与LoadFile进阶

    关于.NET中的反射,常用的有三个方法: Assembly.Load()Assembly.LoadFrom()Assembly.LoadFile() 下面说说这三个方法的区别和一些细节问题 1. As ...

  8. Codeforces 2016 ACM Amman Collegiate Programming Contest A. Coins（动态规划/01背包变形）

    传送门 Description Hasan and Bahosain want to buy a new video game, they want to share the expenses. Ha ...

  9. <<< sqlserver、Mysql、Oracle数据库优缺点

    sqlserver 优点: 易用性.适合分布式组织的可伸缩性.用于决策支持的数据仓库功能.与许多其他服务器软件紧密关联的集成性.良好的性价比等:   为数据管理与分析带来了灵活性,允许单位在快速变化的 ...

  10. red hat关于桥接模式连不上外网或者没有IP

    很多人·在启动虚拟机后连接不上外网,即ifconfig没有ip地址,我总结了一下需要注意的地方: 以下全是在桥接模式. 1.在windows中打开任务管理器-->服务中找到一下几个服务,确保它们 ...