OzJS is NOT yet another script loader, but a microkernel that provides sorely-missing module mechanism at runtime (that means it mainly works at language-level, not file-level. Use ozma.js
to process files statically at build time based on the same mechanism) for large/complex javascript program, compatible with the de facto standards (AMD, NodeJS/CommonJS and traditional module pattern).
Even better, it was implemented earlier than the well-known RequireJS, so there are differences between similar APIs in philosophy and approach, which bring more value.
The API and code of oz.js
are minimalist and stable. It won’t add new features that aren't truly needed (It's absolutely bad practice to meet new requirements through new configuration options or new plugins for a module mechanism provider!). The Oz project now focuses on providing bundles of powerful and yet micro-framework friendly AMD modules.
OzJS才不是神马脚本加载器呢!人家是一个在浏览器端运行时中(就是说它主要服务于语言层级,而不是文件层级。ozma.js
可以在静态构建环节中基于同等机制更好的处理文件)为大型或复杂JS程序提供长期以来严重缺失(你懂得!)的模块机制的微!内!核!它兼容当前的事实标准(AMD,NodeJS/CommonJS 和传统的 module pattern)。
更妙的是!它比大名鼎鼎的RequireJS
实现的更早!所以虽然表面上用法类似,只是443行 vs 1232行、5K vs 24K的区别,实践中oz的设计和实现能带来更强大的能力和更便捷的体验,理念上则差别更大,改日详述…XD
oz.js
的API和代码都是极简和稳定的,不会轻易加新功能(对一个实现模块机制的库来说,通过加入新配置选项或新插件的方式来满足新需求是多么可怕的故事啊!)。Oz项目现在专注于开发一大票能用于自由组合微框架、便于搭建WebApp的通用模块,代码都在/mod
目录里,正在逐个发布和完善文档,一个真实世界中的例子。
Download oz.js
You might also need a domReady module: domready.js
Put them into your project directory, like ./js/lib
and ./js/mod
In your web page:
<script src="js/lib/oz.js"></script>
<script>
require.config({
baseUrl: 'js/'
});
define('jquery', 'lib/jquery.js');
define('app', [
'jquery',
'mod/domready'
], function($){
var app = {
// do something with jquery
};
return app;
});
require(['app'], function(app){
// do something with app
});
</script>
That's all! 呵呵后...
Better practice for real production environments:
<script src="dist/js/main.js"></script>
<script>
// define modules need demand loading outside main.js
define('module(dynamic dependence)', 'CDN_URL/filename_with_timestamp.js');
</script>
Put main.js
into ./js
(not ./dist/js
)
require.config({
baseUrl: 'js/',
distUrl: 'dist/js/'
});
// same as above
Install ozma.js
through NPM:
npm install ozma -g
Create a configure file for ozma
. The default file name is ozconfig.js
, located under the same directory as main.js
. In this way you can omit --config
parameter for ozma
.
{
"baseUrl": "./js/",
"distUrl": "./dist/js/",
"loader": "lib/oz.js",
"disableAutoSuffix": true
}
Build distribution files (one or more):
ozma js/main.js
GRATS! That's all you need! See ./dist/js/main.js
for build results, then refresh the web page, see Network Panel in your browser's developer console.
See usage for more detail:
- Usage with oz.js & ozma.js: demo1(开发环境或生产环境) demo2(开发环境) demo3(生产环境) demo4(使用第三方包管理系统)
- WebApp demo: Doubanchou
……以上不用翻译了罢
- OzJS Builder (Ozma.js): usage
- OzJS Adapter: demo
- mod/lang: demo
- mod/event: demo
- mod/dollar: demo
- mod/animate: demo
- Alphatown 2D browser based virtual world
- Douban Reader Web browser based e-book reader
- Douban's contributor system Online self-publishing tool for Douban Reader
- Bubbler Webapp to explore social music technology
- BugHunter Multiplayer "answer first game" or a competition responder system, based on NodeJS and OzJS