-
Notifications
You must be signed in to change notification settings - Fork 333
组件开发须知
Yan edited this page May 9, 2013
·
4 revisions
假设你开发 Dialog 组件,需要调用 Position 组件提供的功能,这时只要在代码里:
/* dialog.js */
define(function(require, exports, module) {
var position = require('position'); // 用 require 引入就好
...
});
如果 require(xxx)
有问题,请查看 tools/seajs-and-its-friends.js
文件里是否有配置 xxx
的 alias.
对于 UI 相关的组件,为了开发方便,一般至少需要创建一个 example 文件。以 examples/position.html
为例:
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Position Example</title>
<script src="../../../tools/seajs-and-its-friends.js"></script>
</head>
<body>
...
<script>
seajs.use('../src/position', function(position) {
// test code
});
</script>
</body>
</html>
请根据组件的实际情况来组织。参考页面:http://aralejs.org/position/examples/index.html
这个文件是固定的,需要时,复制一份过去就好。文件内容为:
<!doctype html>
<html>
<head>
<title>Jasmine Spec Runner</title>
<script src="../../../tools/seajs-and-its-friends.js"></script>
<script src="../../../tools/jasmine-runner.js"></script>
</head>
<body>
</body>
</html>
要让 runner.html
正常运行,需要注意以下几点:
- 必须通过
http
方式访问,不支持file:///
. -
tests
目录下,按照module-spec.js
的方式组织代码。 - 如果有多个 spec 文件,请在入口 spec 文件里,
require
其他文件即可。
开发好一个模块后,要提供给他人调用前,需要进行打包操作:
$ cd arale
$ node tools/dist.js overlay
上面的代码就会将 overlay 模块的源码进行依赖分析和压缩合并,最后生成到以下目录:
dist/overlay/x.y.z/
如果是第一次打包,或版本有更新,还得编辑 tools/seajs-and-its-friends.js
,将模块名添加下别名。
请联系玉伯。