Cordova 2.4.0或2.5.0或2.6.0和requirejs

njt*_*man 9 ios requirejs cordova

Cordova 2.4.0及更高版本支持AMD加载到javascript中.我特别希望将Cordova 2.5.0与最新版本的RequireJS,backbone,jquery,jquery mobile结合使用.

我还没有看到任何有关如何使用requirejs正确使用新版Cordova的教程或帖子.当Cordova不支持AMD(2.3.0及之前版本)时,我确实看到大量有关如何整合Cordova和requirejs的帖子.

如果有人可以发布或指出一个简单的例子,我将不胜感激.

编辑:具体来说,我的目标是iOS开发.

编辑:我想更具体,并包括我遇到的确切问题.

main.js

require.config({
    paths: {
        cordova: 'libs/cordova/cordova.ios',//cordova-2.5.0',//2.5.0*/
        jquery: 'libs/jquery/jquery.min',//1.9.1
        text: 'libs/require/text',
        domReady: 'libs/require/domReady',
        underscore: 'libs/underscore/underscore-min',
        backbone: 'libs/backbone/backbone-min',
        'jquery.mobile-config': 'libs/jquery-mobile/jqm-config',
        'jquery.mobile': 'libs/jquery-mobile/jquery.mobile.min'
    },
    shim: {
        backbone: {
            deps: ['jquery', 'underscore'],
            exports: 'Backbone'
        },
        underscore: {
            exports: '_'
        },
        'jquery.mobile': {
            deps: ['jquery', 'jquery.mobile-config']
        }
    }
});


require(['app'], function(App){
    App.initialize();
});
Run Code Online (Sandbox Code Playgroud)

app.js

define([
    'cordova',
    'jquery',
    'underscore',
    'backbone',
    'router'
], function(cordova, $, _, Backbone, Router){
    var initialize = function(){
        Router.initialize();
    }
    return {
        initialize: initialize
    };
});
Run Code Online (Sandbox Code Playgroud)

要清楚,在优化require.js项目之前一切正常.当我尝试使用r.js(require.js的一部分)优化项目时,优化器会抛出一个错误,如下所示.

错误channel.js

我不确定channel.js是什么,为什么要求它,但我能在github上找到它 https://github.com/apache/cordova-js/tree/master/lib/common

一旦我创建它正在寻找的子目录,我将channel.js文件放入其中.我不再得到那个错误,但现在是另一个错误,见下文.

在此输入图像描述

我也能够在cordova-js github网站上找到该文件.将该文件放入子目录后,我不会收到任何错误消息,并且项目构建成功.

现在,当我尝试使用单个优化的js文件运行应用程序时,我在javascript控制台中出现此错误,并且只是设备上的空白屏幕.

"ReferenceError:找不到变量:exports"

这是我用来运行优化的build.js文件

({
    baseUrl: "../js",
    mainConfigFile: "../js/main.js",
    name: "../js/main",
    out: "../js/big.js",
    preserveLicenseComments: false,
    paths: {
        requireLib: "../js/libs/require/require"
    },
    include: "requireLib"
})
Run Code Online (Sandbox Code Playgroud)

编辑4/11/13: 回答 感谢SA用户asgeo1的帮助,我解决了问题.事实证明你无法在main.js'cordova'中命名变量,因为它与名为'cordova'的内部变量冲突.

解决方案如下.

main.js

require.config({
    paths: {
        'cordova.ios': 'libs/cordova/cordova.ios',//cordova-2.5.0' THIS IS CHANGED
        jquery: 'libs/jquery/jquery.min',//1.9.1
        text: 'libs/require/text',
        domReady: 'libs/require/domReady',
        underscore: 'libs/underscore/underscore-min',
        backbone: 'libs/backbone/backbone-min',
        'jquery.mobile-config': 'libs/jquery-mobile/jqm-config',
        'jquery.mobile': 'libs/jquery-mobile/jquery.mobile.min'
    },
    shim: {
        backbone: {
            deps: ['jquery', 'underscore'],
            exports: 'Backbone'
        },
        underscore: {
            exports: '_'
        },
        'jquery.mobile': {
            deps: ['jquery', 'jquery.mobile-config']
        }
    }
});


require(['app'], function(App){
    App.initialize();
});
Run Code Online (Sandbox Code Playgroud)

app.js

define([
    'cordova.ios',//THIS IS CHANGED
    'jquery',
    'underscore',
    'backbone',
    'router'
], function(cordova, $, _, Backbone, Router){
    var initialize = function(){
        Router.initialize();
    }
    return {
        initialize: initialize
    };
});
Run Code Online (Sandbox Code Playgroud)

该解决方案可以使用Cordova 2.5.0和2.6.0进行测试

asg*_*eo1 5

我也有同样的问题.它们如何构建随Cordova 2.4/2.5分发的cordova.ios.js文件似乎是一个问题

正如您所知,cordova.ios.js文件中的cordova/channelcordova/utils部分的顺序不正确.

这就是为什么RequireJS尝试加载单个文件,因为尚未在cordova.ios.js文件中发生这些模块.

不幸的是,当你将channel.js和utils.js文件放在项目中时,你实际上并没有解决问题的根本原因.

当然,这允许它构建,但ReferenceError: Can't find variable: exports然后出现错误,因为RequireJS会将utils.js/channel.js的内容放在cordova.ios.js内容的其余部分之上 - 这不好,因为它们依赖于导出的东西正在设置cordova.ios.js内部.

更不用说你现在在你的构建文件中有两个 channel.js/utils.js代码副本......

解决方案是您必须自己修改cordova.ios.js.将cordova/channel和cordova/utils移动到cordova.ios.js的顶部(但是在定义了exports/requirejs之后)

你可以在这里找到我自己准备的:https://gist.github.com/asgeo1/5361227

另外,另一个提示 - 在你的main.js中,并没有将cordova.ios.js称为'cordova'.这将发生冲突,因为cordova.ios.js已在内部使用此模块名称.

请改用'cordova.ios':

require.config({
    paths: {
        'cordova.ios': 'libs/cordova/cordova.ios',
        ...
Run Code Online (Sandbox Code Playgroud)

  • 不用担心,部件出现故障的问题仅在2.4和2.5之间.值得庆幸的是,它已修复2.6;) (3认同)