我想使用requireJS,我正在使用jQuery.我不想使用requireJS和jQuery的组合版本,因为我没有使用最新的jQuery版本.使用requireJS的最佳方式是什么？
Jas*_*ith 129
这也是我的确切问题!我还必须使用较旧的jQuery,还有更"传统"的javascript库.这样做的最佳技巧是什么？(如果你不介意,我可以编辑你的问题,使其更广泛.)这是我学到的.
RequireJS作者James Burke解释了合并的RequireJS + jQuery文件的优点.你得到两件事.
一个模块,jquery可用,它是jQuery对象.这很安全:
// My module depends on jQuery but what if $ was overwritten?
define(["jquery"], function($) {
// $ is guaranteed to be jQuery now */
})
jQuery是之前任何已加载require()或define()东西.所有模块都保证jQuery已准备就绪.你甚至不需要require/order.js插件,因为jQuery基本上是硬编码的,首先加载.
对我来说,#2不是很有帮助.大多数真正的应用程序都有许多 .js文件必须以正确的顺序加载 - 令人遗憾但却是真实 只要你需要Sammy或Underscore.js,组合的RequireJS + jQuery文件就无济于事.
我的解决方案是编写简单的RequireJS包装器,使用"order"插件加载我的传统脚本.
假设我的应用程序具有这些组件(依赖).
在我看来,上面的一切.js都是一个"传统"的脚本.没有的东西.js是RequireJS插件.关键是:高级别的东西(greatapp,my_sammy)是模块,而在更深层次上,它又回归到传统.js文件.
这一切都始于一个告诉RequireJS如何启动的引导程序.
<html>
<head>
<script data-main="js/boot.js" src="js/require.js"></script>
</head>
</html>
在js/boot.js我只放置配置和如何启动应用程序.
require( // The "paths" maps module names to actual places to fetch the file.
// I made modules with simple names (jquery, sammy) that will do the hard work.
{ paths: { jquery: "require_jquery"
, sammy : "require_sammy"
}
}
// Next is the root module to run, which depends on everything else.
, [ "greatapp" ]
// Finally, start my app in whatever way it uses.
, function(greatapp) { greatapp.start(); }
);
在greatapp.js我有一个看起来很正常的模块.
define(["jquery", "sammy"], function($, Sammy) {
// At this point, jQuery and SammyJS are loaded successfully.
// By depending on "jquery", the "require_jquery.js" file will run; same for sammy.
// Those require_* files also pass jQuery and Sammy to here, so no more globals!
var start = function() {
$(document).ready(function() {
$("body").html("Hello world!");
})
}
return {"start":start};
}
require_jquery.js:
define(["/custom/path/to/my/jquery.js?1.4.2"], function() {
// Raw jQuery does not return anything, so return it explicitly here.
return jQuery;
})
require_sammy.js:
// These must be in order, so use the "order!" plugin.
define([ "order!jquery"
, "order!/path/to/custom/sammy/sammy-0.6.2-min.js"
, "order!/path/to/custom/sammy/plugins/sammy.json-0.6.2-min.js"
, "order!/path/to/custom/sammy/plugins/sammy.storage-0.6.2-min.js"
, "order!/path/to/custom/sammy/plugins/sammy.mustache-0.6.2-min.js"
]
, function($) {
// Raw sammy does not return anything, so return it explicitly here.
return $.sammy;
}
);
Chr*_*ris 32
这个问题现在至少已有两年了,但我注意到这仍是RequireJS 2.0的问题(require-jquery.js使用jQuery 1.8.0,但最新版本是1.8.2).
如果你碰巧看到这个问题,请注意require-jquery.js现在只是require.js和jquery.js,一起捣碎. 您可以编辑require-jquery.js并用更新的版本替换jQuery部分.
更新(2013年5月30日):现在RequireJS有路径和填充程序,有一种新方法可以导入jQuery和jQuery插件,不再需要也不建议使用旧方法.这是当前方法的删节版本:
requirejs.config({
"paths": {
"jquery": "//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min"
}
});
define(["jquery"], function($) {
$(function() {
});
});
有关详细信息,请参阅http://requirejs.org/docs/jquery.html.
我发现最好的方法是将jQuery保留在RequireJS构建之外.
只需在HTML中包含jquery.min.js即可.然后,用这样的东西制作一个jquery.js文件......
define([], function() {
return window.$;
});
| 归档时间： |
|
| 查看次数： |
57722 次 |
| 最近记录： |