sea.js常用的api简易文档_Seajs

本文罗列了seajs常用的api和代码示例,下面话不多说,来看看详细的介绍,有需要的朋友们可以参考借鉴。

一、seajs.config

alias

别名配置,配置之后可在模块中使用require调用 require('jquery');

seajs.config({
 alias: { 'jquery': 'jquery/jquery/1.10.1/jquery' }
});
define(function(require, exports, module) {
 //引用jQuery模块
 var $ = require('jquery');
});

paths 设置路径,方便跨目录调用。通过灵活的设置path可以在不影响base的情况下指定到某个目录。

seajs.config({
 //设置路径
 paths: {
  'gallery': 'https://a.alipayobjects.com/gallery'
 },
 // 设置别名,方便调用
 alias: {
  'underscore': 'gallery/underscore'
 }
});

vars

变量配置。有些场景下,模块路径在运行时才能确定,这时可以使用 vars 变量来配置。

vars 配置的是模块标识中的变量值,在模块标识中用 {key} 来表示变量。

seajs.config({
 // 变量配置
 vars: {
  'locale': 'zh-cn'
 }
});
define(function(require, exports, module) {
 var lang = require('./i18n/{locale}.js');
  //=> 加载的是 path/to/i18n/zh-cn.js
});

map

该配置可对模块路径进行映射修改,可用于路径转换、在线调试等。

seajs.config({
 map: [
  [ '.js', '-debug.js' ]
 ]
});
define(function(require, exports, module) {
 var a = require('./a');
 //=> 加载的是 path/to/a-debug.js
});

preload

使用preload配置项,可以在普通模块加载前,提前加载并初始化好指定模块。

preload中的空字符串会被忽略掉。

// 在老浏览器中,提前加载好 ES5 和 json 模块
seajs.config({
 preload: [
  Function.prototype.bind ? '' : 'es5-safe',
  this.JSON ? '' : 'json'
 ]
});

注意:preload中的配置,需要等到 use 时才加载。比如:

seajs.config({
 preload: 'a'
});
// 在加载 b 之前,会确保模块 a 已经加载并执行好
seajs.use('./b');

debug

值为true时,加载器不会删除动态插入的 script 标签。插件也可以根据debug配置,来决策 log 等信息的输出。

base

Sea.js 在解析顶级标识时,会相对 base 路径来解析。

注意:一般请不要配置 base 路径,把 sea.js 放在合适的路径往往更简单一致。

charse

获取模块文件时,<script> 或 <link> 标签的charset属性。 默认是utf-8 charset还可以是一个函数:

seajs.config({
 charset: function(url) {
  // xxx 目录下的文件用 gbk 编码加载
  if (url.indexOf('http://example.com/js/xxx') === 0) {
   return 'gbk';
  }
  // 其他文件用 utf-8 编码
  return 'utf-8';
 }
});

二、seajs.use

用来在页面中加载一个或多个模块。seajs.use(id, callback?)

// 加载一个模块
seajs.use('./a');
// 加载一个模块,在加载完成时,执行回调
seajs.use('./a', function(a) {
 a.doSomething();
});
// 加载多个模块,在加载完成时,执行回调
seajs.use(['./a', './b'], function(a, b) {
 a.doSomething();
 b.doSomething();
});

注意:seajs.use 与 DOM ready 事件没有任何关系。如果某些操作要确保在 DOM ready 后执行,需要使用 jquery 等类库来保证。比如

seajs.use(['jquery', './main'], function($, main) {
 $(document).ready(function() {
  main.init();
 });
});

注意:use方法第一个参数一定要有,但是可以是null,也可以是一个变量

var bootstrap = ['bootstrap.css', 'bootstrap-responsive.css', 'bootstrap.js'];
seajs.use(bootstrap, function() {
 //do something
});

三、seajs.cache

通过 seajs.cache,可以查阅当前模块系统中的所有模块信息。

比如,打开 seajs.org,然后在 WebKit Developer Tools 的 Console 面板中输入 seajs.cache,可以看到:

Object
 > http://seajs.org/docs/assets/main.js: x
 > https://a.alipayobjects.com/jquery/jquery/1.10.1/jquery.js: x
 > __proto__: Object

这些就是文档首页用到的模块。展开某一项可以看到模块的具体信息,含义可参考:CMD 模块定义规范 中的 module 小节。

四、seajs.reslove

类似require.resolve,会利用模块系统的内部机制对传入的字符串参数进行路径解析。

seajs.resolve('jquery');
// => http://path/to/jquery.js
seajs.resolve('./a', 'http://example.com/to/b.js');
// => http://example.com/to/a.js

seajs.resolve 方法不光可以用来调试路径解析是否正确,还可以用在插件开发环境中。

五、seajs.data

通过 seajs.data,可以查看 seajs 所有配置以及一些内部变量的值,可用于插件开发。当加载遇到问题时,也可用于调试。

六、常见问题

关于模块标识

Seajs模块标识主要以小驼峰字符串、.或..

// 在 http://example.com/js/a.js 的 factory 中:
require.resolve('./b');
 // => http://example.com/js/b.js
// 在 http://example.com/js/a.js 的 factory 中:
require.resolve('../c');
 // => http://example.com/c.js

分为 相对 与 顶级 标识。以.或..开头,则为相对标识 。以小驼峰字符串开关,则为顶级标识。

// 假设 base 路径是:http://www.aseoe.com/assets/
// 在模块代码里:
require.resolve('gallery/jquery/1.9.1/jquery');
 // => http://www.aseoe.com/assets/gallery/jquery/1.9.1/jquery.js

//sea.js的路径,即 base 路径,相对于当前页面
<script src="../actjs/assets/sea-modules/seajs/2.1.1/sj.js"></script>
<script type="text/javascript">
//配置Seajs
seajs.config({
 alias: {
  //顶级标识,基于 base 路径
  'actjs': 'actjs/core/0.0.7/core.js',
   // => http://
  'position': 'actjs/util/0.0.2/position.js'
 }
});
seajs.config({
 alias: {
  //普通路径,相对于当前页面
  'affix': '../../actjs/assets/widget/src/widget-affix.js',
  //相对标识,相对于当前页面
  'init': './src/init.js'
 }
});
</script>

关于路径

Seajs除了相对与顶级标识之外,还可以使用普通路径来加载模块。

就到当前页面的脚本分析

开始的时候会觉得Seajs的路径有点不习惯,由其是Base路径。切记Base路径就是sea.js的那个文件的上级路径,然后所有顶级标识,相对标识都是相对于这个Base来调整。

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作带来一定的帮助如果有疑问大家可以留言交流。

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索api
, sea.js
, sea.js文档
sea.js官方文档
seajs api、seajsapi、sea.js api、常用中药材简易识别法、常用穴位简易取穴法,以便于您获取更多的相关知识。

时间: 2024-11-01 00:09:48

sea.js常用的api简易文档_Seajs的相关文章

seajs的常用api简易文档

目前使用sea.js的公司越来越多, 比如朋友网,阿里巴巴,淘宝网,百姓网,支付宝,有道云笔记等.模块化的javascript开发带来了可维护,可扩展性,尤其在多人协作开发的时候不用再担心文件依赖和函数命名冲突的问题,有点扯远了,下面罗列了seajs常用的api和代码示例 seajs.config seajs.use seajs.cache seajs.reslove seajs.data 常见问题 关于模块标识 关于路径 seajs.config  alias 别名配置,配置之后可在模块中使用

Seajs 简易文档 提供简单、极致的模块化开发体验_Seajs

非官方文档,整理来自己官方文档的文字与实例,方便速查. 为什么使用 Sea.js ? Sea.js 追求简单.自然的代码书写和组织方式,具有以下核心特性: 简单友好的模块定义规范:Sea.js 遵循 CMD 规范,可以像 Node.js 一般书写模块代码. 自然直观的代码组织方式:依赖的自动加载.配置的简洁清晰,可以让我们更多地享受编码的乐趣. Sea.js 还提供常用插件,非常有助于开发调试和性能优化,并具有丰富的可扩展接口. 兼容性 Sea.js 具备完善的测试用例,兼容所有主流浏览器: C

CYQ.Data 轻量数据层之路 优雅V1.4 现世 附API帮助文档(九)

继上一版本V1.3版本发布到现在,时隔N天了:[V1.3版本开源见:CYQ.Data 轻量数据层之路 华丽V1.3版本 框架开源]   N天的时间,根据各路网友的反映及自身的想法,继续修改优化着本框架,力求让大伙相对满意: 对于:bug反馈.优化建议.及最新框架版本下载见:CYQ.Data 轻量数据层之路 bug反馈/优化建议/框架下载 升级说明: 本次升级只是针对易用性增加功能或优化代码及方法,并未发现V1.3版本存在任何bug, 因此,对于V1.3版本,大伙可放心使用,同时也已开放源码. 若

android平台api帮助文档---android版的MSDN

android平台api帮助文档---android版的MSDN            做android应用开发,现在网上的资料大把大把的,但是都是零零碎碎的,有时候去查一个接口得去android官方网站http://developer.android.com/develop/index.html,由于网络速度问题,有时候要很久才能出来,真急死人了,那有没有快捷一点的方式呢?         当然有.那就是把android SDK api帮助文档都下下来,但是怎么下呢?         第一步:

jqPlot 图表中文API使用文档及源码和在线示例_jquery

简介 jqplot是一款非常不错的基于jquery的图表插件,这篇文章主要帮助大家整理了jqplot的中文使用说明和在线示例及源码下载.jqplot插件在支持HTML5的浏览器上将会在canvas上呈现图表. 引入脚本文件 jqplot需要1.4.3以上的jquery版本支持,刚才说过了,jqplot在支持HTML5 Canvas的浏览器上将以canvas呈现,否则,如果你在IE9以下版本的浏览器上则要引入excanvas.js文件,当然,jqplot的CSS文件也要同时引入,代码如下: 复制代

java api 帮助文档 chm 1.5 1.6 中文版英文版.

Sun 公司提供的Java API Docs是学习和使用Java语言中最经常使用的参考资料之一.但是长期以来此文档只有英文版,对于中国地区的Java开发者来说相当的不便.目前Sun 公司正在组织多方力量将此文档翻译成中文,并于2005年10月31日在Sun 中国技术社区(http://gceclub.sun.com.cn/)正式发布第一批中文版Java API文档(包括java.lang和java.util类库API 文档的中文版).经过将近10个月的努力,目前我们已经将Java SE 5.0的

求coreldraw api 帮助文档

问题描述 求CorelDRAWapi帮助文档万分感谢 解决方案 解决方案二:安装后就有啊

求助 javaEE javaSE struts2 hibernate spring API 中文版 文档

问题描述 求助javaEEjavaSEstruts2hibernatespringAPI中文版文档邮箱644486560@qq.com

simplehtmldom Doc api帮助文档_php技巧

API Reference Helper functions object str_get_html ( string $content ) Creates a DOM object from a string. object file_get_html ( string $filename ) Creates a DOM object from a file or a URL. DOM methods & properties stringplaintext Returns the conte