I downloaded the sample-project for the latest-release of RequireJS. Their documentation implies anything loaded is passed-into the parameter list of the associated function (in corresponding order).
So I decided to try it...but it doesn't seem to work!
Firebug(net tab) showsjQueryas being loaded: soRequireJSobvioulsy did that part successfullyFirebug(console tab) shows '$ is not a function'
My question is: Why isn't the alias getting populated?
MY CODE LOOKS LIKE:
<html xmlns="">
<head runat="server">
<title></title>
<script src="Scripts/require.js" type="text/javascript"></script>
<script type="text/javascript">
require(["scripts/jQuery/Core/jquery-1.7.2.min"], function ($) {
// jQuery is not passed-into the function, so the alias fails!
$(function () {
var stop = "";
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
</form>
</body>
</html>
THIER SAMPLE LOOKS LIKE:
//Inside scripts/main.js
require(["some/module", "a.js", "b.js"], function(someModule) {
//...
});
I downloaded the sample-project for the latest-release of RequireJS. Their documentation implies anything loaded is passed-into the parameter list of the associated function (in corresponding order).
So I decided to try it...but it doesn't seem to work!
Firebug(net tab) showsjQueryas being loaded: soRequireJSobvioulsy did that part successfullyFirebug(console tab) shows '$ is not a function'
My question is: Why isn't the alias getting populated?
MY CODE LOOKS LIKE:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="Scripts/require.js" type="text/javascript"></script>
<script type="text/javascript">
require(["scripts/jQuery/Core/jquery-1.7.2.min"], function ($) {
// jQuery is not passed-into the function, so the alias fails!
$(function () {
var stop = "";
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
</form>
</body>
</html>
THIER SAMPLE LOOKS LIKE:
//Inside scripts/main.js
require(["some/module", "a.js", "b.js"], function(someModule) {
//...
});
3 Answers
Reset to default 17jQuery should be loaded through the special name "jquery", otherwise it won't register itself (since jQuery uses a named define).
// create an alias that points to proper file
require.config({
paths : {
jquery : "http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min"
}
});
// require jquery usign the path config
require(["jquery"], function ($) {
console.log($);
});
That is the main reasons why named define is considered an anti-pattern and should be used only when needed (when you have multiple modules inside same file).
Be sure to read the "README.md" for the RequireJS+jQuery sample project. There are many complications with using jQuery that you need to decide on how best to tackle it for your project during the initial setup. Once you've figured out what's best for you and implemented it, though, it shouldn't be a problem again.
Much of the complication also comes from the fact that jQuery isn't a true AMD module, they just have a hack in the codebase to do a define if it detects the define function is available. For example, this means the jQuery module name will always be "jquery" (note the lowercase 'q') unless you wrap it yourself, so if you define the path for it in your config you MUST have the key named "jquery" (again, with a lowercase 'q') or there will be a mismatch. That bit us when first setting up RequireJS on our project (we named the key "jQuery").
Is your scripts folder 'Scripts' or 'scripts'?
You're making a request for "Scripts/require.js" as well as for "scripts/jQuery/Core/jquery-1.7.2.min". Take a look at the Net tab of Firebug... I bet you're generating a 404 there.