使用带有RequireJS的私有jquery – 优化后发出问题

我正在使用requireJS和一个CDN版本的jQuery（现在是推荐的方法）组合一个框架，并在优化代码时遇到一些问题。 输出是命名空间的，我指定每个模块使用文档中概述的jquery的私有版本：

require.config({ // Add this map config in addition to any baseUrl or // paths config you may already have in the project. map: { // '*' means all modules will get 'jquery-private' // for their 'jquery' dependency. '*': { 'jquery': 'jquery-private' }, // 'jquery-private' wants the real jQuery module // though. If this line was not here, there would // be an unresolvable cyclic dependency. 'jquery-private': { 'jquery': 'jquery' } } }); // and the 'jquery-private' module, in the // jquery-private.js file: define(['jquery'], function (jq) { return jq.noConflict( true ); }); 

我在优化后看到的问题是“jq”在“jquery-private.js”文件中未定义。

有任何想法吗？ 我试过设置jq = $但这似乎破坏了全局。

谢谢。

Answer 1

以下是我从RequireJS jQuery Instructions页面链接到jQuery CDN和优化示例 以使用映射模块来使用你在原始问题中粘贴的noConflict部分所做的工作。

1 – 分叉样品

2 – 使用此内容创建文件www/js/lib/jquery-private.js

 define(['jquery'], function (jq) { return jq.noConflict( true ); }); 

3 – 修改了www/js/app.js以粘贴map部分，以便require.config现在如下所示：

 requirejs.config({ "baseUrl": "js/lib", "paths": { "app": "../app", "jquery": "//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min" }, map: { '*': { 'jquery': 'jquery-private' }, 'jquery-private': { 'jquery': 'jquery' } } }); 

4 – 修改www/js/app/main.js使用jqlocal而不是$ （只是为了向自己certificate它不是全局jQuery：

 define(["jquery", "jquery.alpha", "jquery.beta"], function(jqlocal) { jqlocal(function() { jqlocal('body').alpha().beta(); }); }); 

5 – 更改为tools文件夹并运行：

 node r.js -o build.js 

6 – 更改为创建并运行servedir的www-build文件夹（与哪个Web服务器servedir但这是我用于dev的内容）

7 – 浏览应用程序的本地地址和端口号（在我的情况下为http://localhost:8000/app.html ）并看到：

阿尔法就是去！

Beta是Go！

你可以在这里看到最终结果

Answer 2

为了实现这一点，我改变了我使用Require的方式（可能我应该如何一直这样做）。 这些信息可能对其他人有用，所以我想我会把它放在那里。

以前我在定义的模块中指定了任何依赖项：

 define( [ "dep1", "dep2", "jquery" ], function( var1, var2, jq ) { 

这最初工作正常，但在优化时失败。 我将依赖项移动到包含此模块的require函数调用，然后它开始在优化前后均正常工作，私有使用jquery：

 require( [ 'jquery', 'dep1', 'dep2' ], function( jq, var1, var2 ) { formValidator.formValidationInit( jq( el ) ); }); 

我不会想到这会有所作为，但它似乎也是如此。

值得注意的是，我必须更改jquery-private文件，因为它仍然引发了一个关于“jq”没有被定义的问题。 我现在将jq设置为等于全局$并返回它，以便可以使用它：

 define(['jquery'], function () { var jq = $; return jq.noConflict( true ); });